Funkcja i prototyp JavaScript - podstawowy problem z routingiem dzięki metodom wywoływania

Question

Zbliżam się do nauki JavaScript z tła Ruby, więc mam pewne problemy ze zrozumieniem (i wyrażeniem tego w słowach), dlaczego mój kod nie daje wyników I potrzeba. Uruchomiłem to na pythontutor.com, aby zobaczyć krok po kroku, co się dzieje, i to potwierdza moje podejrzenia. Jednak nie jestem do końca pewien, dlaczego tak się dzieje.

Buduję termostat, który ma powrócić "zielony", gdy temperatura spadnie poniżej 18dC. W mojej przedostatniej linijce konsola.log ma wartość 17, co jest poprawne, jednak gdy zadzwonię pod numer thermostat.displayColor w ostatnim wierszu, nadal mówi się w kolorze żółtym. Kod kończy się tam i nie wraca przez this.displayColor = this.currentColor(), czego się spodziewam (ponieważ zrobił to podczas pierwszego uruchomienia, aby zdefiniować kolor początkowy jako "żółty"

Kod działa poprawnie i zwraca "zielony" jeśli zmienię kod na bezpośredni wywołanie metody prototypowej this.currentColor(), ale po prostu chcę wiedzieć, dlaczego nie pozwala mi to zrobić w sposób opisany poniżej:

Nie jestem pewien co do terminologii opisującej to problem, przepraszam z góry, bo mój tytuł nie jest dokładny.

var DEFAULT_TEMP = 20; 

function Thermostat(){ 
    this.temperature = DEFAULT_TEMP; 
    this.maxTemp = 25; 
    this.powerMode = 'on'; 
    this.displayColor = this.currentColor() 
}; 

Thermostat.prototype.downButton = function(){ 
    if (this.temperature === 10){ 
    throw new Error('temp cannot be lower than 10dC'); 
    }; 
    this.temperature --; 
}; 

Thermostat.prototype.currentColor = function() { 
    if ((this.temperature >= 18) && (this.temperature < 25)) { 
    return 'yellow' 
    } 
    else if (this.temperature < 18) { 
    return 'green' 
    } 

    else { 
    return 'red' 
    } 
}; 

var thermostat = new Thermostat(); 
for (var i = 1; i <= 3; i++) { 
     thermostat.downButton(); 
     }; 
console.log("spec file test green, temp should be 17 and is:" + thermostat.temperature) 
console.log(thermostat.displayColor); //this should be green, but it is yellow! 

Answer 1

Powinieneś zadzwonić metoda currentColor(), displayColor jest ustawiona tylko w konstruktorze (w którym to czasie temperatura wynosi 20) i nie jest aktualizowana, gdy zmienia się temperatura.

To może mieć sens, aby dodać ustawienie kolorów metody downButton:

Thermostat.prototype.downButton = function(){ 
    if (this.temperature === 10){ 
    throw new Error('temp cannot be lower than 10dC'); 
    }; 
    this.temperature --; 
    this.displayColor = this.currentColor(); 
}; 

Answer 2

Jak mówi Rob, należy wywołać funkcję, która oblicza aktualny kolor. Oto jego propozycja wraz z kilkoma ulepszeniami do kodu:

function Thermostat() { 
 
    this.MIN_TEMP = 10; 
 
    this.MAX_TEMP = 25; 
 
    this.temperature = 20; 
 
} 
 

 
Thermostat.prototype.decreaseTemp = function() { 
 
    if (this.temperature > this.MIN_TEMP) this.temperature--; 
 
}; 
 
Thermostat.prototype.increaseTemp = function() { 
 
    if (this.temperature < this.MAX_TEMP) this.temperature++; 
 
}; 
 
Thermostat.prototype.currentColor = function() { 
 
    if (this.temperature < 18) return 'green'; 
 
    if (this.temperature < 25) return 'yellow'; 
 
    return 'red'; 
 
}; 
 

 
var thermostat = new Thermostat(); 
 
for (var i = 1; i <= 3; i++) { 
 
    thermostat.decreaseTemp(); 
 
} 
 

 
// no errors mean all assertions pass 
 
thermostat.temperature.should.equal(17); 
 
thermostat.currentColor().should.equal('green');

<script src="https://cdnjs.cloudflare.com/ajax/libs/should.js/8.2.2/should.min.js"></script>