Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Почему не работает this в setInterval? (https://javascript.ru/forum/misc/58710-pochemu-ne-rabotaet-v-setinterval.html)

menscool 06.10.2015 16:58

Почему не работает this в setInterval?
 
Всем привет!
Выполняю задачу из урока, нужно было переписать класс "часы", используя прототипное наследование:

function Clock(options) {

    'use strict';

    this._template = options.template;

    this._timer;

}

Clock.prototype._render = function() {
    var date = new Date();

    var hours = date.getHours();
    if (hours < 10) hours = '0' + hours;

    var min = date.getMinutes();
    if (min < 10) min = '0' + min;

    var sec = date.getSeconds();
    if (sec < 10) sec = '0' + sec;

    var output = this._template.replace('h', hours).replace('m', min).replace('s', sec);

    console.log(output);
};

Clock.prototype.stop = function() {
    clearInterval(this._timer);
};

Clock.prototype.start = function() {
    this._render();
    var self = this;
    this._timer = setInterval(this._render, 1000);
};

var clock = new Clock({template : 'h : m : s'});
clock.start();


При запуске часов
var clock = new Clock({template : 'h : m : s'});
clock.start(); - они отрабатывают один раз, а далее - ошибка - Cannot read property 'replace' of undefined.
Если же заменить this.render в setInterval на self.render и обернуть в анонимную функцию - часы работают бесконечно, а не только один раз :)

Почему же так происходит? Почему this верен только при первом срабатывании функции? Запутался:-?

ruslan_mart 07.10.2015 06:46

Цитата:

Сообщение от menscool
this._timer = setInterval(this._render, 1000);

this._timer = setInterval(this._render.bind(this), 1000);


Часовой пояс GMT +3, время: 16:48.