setInterval метод не работает [дубликат]
8 ответов
Строка setInterval должна выглядеть так: -
this.intervalID = setInterval(
(function(self) { //Self-executing func which takes 'this' as self
return function() { //Return a function in the context of 'self'
self.retrieve_rate(); //Thing you wanted to run as non-window 'this'
}
})(this),
this.INTERVAL //normal interval, 'this' scope not impacted here.
);
Изменить: тот же принцип применяется к «onload». В этом случае его общий для «внешнего» кода делать мало, он просто устанавливает запрос, а затем отправляет его. В этом случае дополнительные накладные расходы дополнительные функции, как в приведенном выше коде, не нужны. Ваш retrieve_rate должен выглядеть следующим образом: -
retrieve_rate : function()
{
var self = this;
var ajax = new XMLHttpRequest();
ajax.open('GET', 'http://xyz.com', true);
ajax.onreadystatechanged= function()
{
if (ajax.readyState == 4 && ajax.status == 200)
{
// prefs available as self.prefs
}
}
ajax.send(null);
}
Это не решение для красоты, но оно широко используется:
var self = this;
var ajax = null;
//...
ajax.onload = function() {
self.prefs....;
}
-
1Проблема в том, как
setIntervalвызывает функциюretrieve_rate, значениеthisвнутри метода относится к глобальному объекту ... – CMS 1 May 2010 в 09:15
window.setInterval(function(){console.log(this)}.bind(this), 100)
это законно в javascript и сохраняет много кода:)
Это было бы самое чистое решение, так как большую часть времени вы действительно хотите переключить этот контекст для своих последовательных вызовов методов:
Также легче понять концепцию.
// store scope reference for our delegating method
var that = this;
setInterval(function() {
// this would be changed here because of method scope,
// but we still have a reference to that
OURMETHODNAME.call(that);
}, 200);
-
1
Поведение setInterval по умолчанию - это привязка к глобальному контексту. Вы можете вызвать функцию-член, сохранив копию текущего контекста. Внутри retrieve_rate переменная this будет правильно привязана к исходному контексту. Вот как выглядит ваш код:
var self = this;
this.intervalID = setInterval(
function() { self.retrieve_rate(); },
this.INTERVAL);
Бонусный совет: для простой ссылки на функцию (в отличие от ссылки на объект, которая имеет функцию-член) вы можете изменить контекст с помощью JavaScript call или apply.
-
1Это сработало для меня, однако призыв к вызову не нужен. Контекст retrieve_rate должен быть установлен по умолчанию, потому что он вызывается как функция-член. – Dreendle 7 February 2012 в 14:47
-
2@Dreendle - вы правы, я вспомнил, что решил это для ссылки на функцию обратного вызова, где это было необходимо. Я исправил ответ, спасибо! – Joel Fillmore 8 February 2012 в 18:43
prefs: null,
startup : function()
{
// init prefs
...
this.retrieve_rate();
var context = this;
this.intervalID = setInterval(function()
{
context.retrieve_rate();
}, this.INTERVAL);
},
retrieve_rate : function()
{
var ajax = null;
ajax = new XMLHttpRequest();
ajax.open('GET', 'http://xyz.com', true);
var context = this;
ajax.onload = function()
{
// access prefs using context.
// e.g. context.prefs
}
}
-
1
thisвнутри функции, переданной вsetInterval, будет ссылаться на глобальный объект. Вы имели в видуcontext.retrieve_rateвместоthis.retrieve_rate? – CMS 1 May 2010 в 09:11 -
2
-
3Это эволюционировало в правильном направлении, не нужно, чтобы контекст передавался как параметр. – AnthonyWJones 1 May 2010 в 09:16
-
4@Matthew, Anthony Итак, как мне получить доступ к нему из onload? Пробовал this.prefs, но не работал ... – Pablo 1 May 2010 в 09:19
-
5Приветствую вас, Мэтью, кстати, вам не нужно использовать
call,context.retrieve_rate()достаточно, так как у вас есть базовый объект (context.) – CMS 1 May 2010 в 09:19
this.intervalID = setInterval(this.retrieve_rate.bind(this), this.INTERVAL);
-
1Это правильное решение. Для принятого решения требуется излишне большее количество кода. – theoutlander 23 May 2014 в 00:37
-
2Но этот метод имеет недостаток. Скорее всего, он не будет работать со старыми версиями IE – Nechehin 11 June 2014 в 13:25
-
3
-
4
-
5Если вам нужна поддержка IE8 и , вы используете Underscore.js , вы можете использовать
_.bind:this.intervalID = setInterval(_.bind(this.retrieve_rate, this), this.INTERVAL);– gfullam 21 August 2015 в 15:44
При улучшенной поддержке браузера время теперь полезно использовать расширение EcmaScript 6, метод стрелки => , чтобы сохранить this правильно.
startup : function()
{
// init prefs
...
this.retrieve_rate();
this.intervalID = setInterval( () => this.retrieve_rate(), this.INTERVAL);
},
Использование метода => сохраняет this, когда retrieve_rate() вызывается интервалом. Нет необходимости в напуганном себе или прохождении this в параметрах
selfявляется единственным вариантом здесь? можете ли вы подтвердить, что решение Мэтью не будет работать? – Pablo 1 May 2010 в 14:03thisв качестве параметра, который был ненужным и неудобным (любой вызывающий абонентretrieve_rateзнал бы это ненужное специальное требование). – AnthonyWJones 1 May 2010 в 20:26thisв качестве аргумента(function(self){...})(this)в setInterval не работала для меня, потому что функция выполняется немедленно, а не задерживается. Решение @Joel Fillmore для меня работает – Homan 21 January 2013 в 20:59