Как передать параметр в обратный вызов setTimeout ()?

setTimeout(function() {
    postinsql(topicId);
}, 4000)

Вам нужно передать анонимную функцию в качестве параметра вместо строки, последний метод не должен работать даже в соответствии со спецификацией ECMAScript, но браузеры просто снисходительны. Это правильное решение, никогда не полагайтесь на передачу строки как «функции» при использовании setTimeout() или setInterval(), это медленнее, потому что его нужно оценивать, и это просто неправильно.

ОБНОВИТЬ:

Как сказал Хобблин в своих комментариях на вопрос, теперь вы можете передавать аргументы функции внутри setTimeout, используя Function.prototype.bind().

Пример:

setTimeout(postinsql.bind(null, topicId), 4000);

В современных браузерах (например, IE11 и выше) setTimeout получает третий параметр, который отправляется как параметр внутренней функции в конце таймера.

Пример:

var hello = "Hello World";
setTimeout(alert, 1000, hello);

Подробнее:

• https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers.setTimeout
• http://arguments.callee.info/2008/11/10/passing-arguments-to-settimeout-and-setinterval/

После некоторого исследования и тестирования единственная правильная реализация:

setTimeout(yourFunctionReference, 4000, param1, param2, paramN);

setTimeout передаст все дополнительные параметры вашей функции, чтобы их можно было обработать там.

Анонимная функция может работать для очень простых вещей, но в экземпляре объекта, где вы должны использовать "this", нет способа заставить ее работать. Любая анонимная функция изменит "this", чтобы указать на окно, поэтому вы потеряете ссылку на объект.

Это очень старый вопрос с уже "правильным" ответом, но я подумал, что упомянул бы еще один подход, о котором здесь никто не упоминал. Это скопировано и вставлено из превосходной библиотеки подчеркивания:

_.delay = function(func, wait) {
  var args = slice.call(arguments, 2);
  return setTimeout(function(){ return func.apply(null, args); }, wait);
};

Вы можете передать столько аргументов, сколько хотите, в функцию, вызываемую setTimeout и, в качестве дополнительного бонуса (ну, обычно бонуса) значение аргументов, переданных вашей функции, замораживается, когда вы вызываете setTimeout, поэтому, если они меняют значение в какой-то момент между вызовом setTimeout () и истечением времени ожидания, ну ... это уже не так ужасно разочаровывает :)

Вот скрипка, где вы можете понять, что я имею в виду.

Недавно я столкнулся с уникальной ситуацией, когда мне нужно было использовать setTimeout в цикле. Понимание этого может помочь вам понять, как передавать параметры в setTimeout.

Метод 1

Используйте forEach и Object.keys в соответствии с Сукимы. предложение:

var testObject = {
    prop1: 'test1',
    prop2: 'test2',
    prop3: 'test3'
};

Object.keys(testObject).forEach(function(propertyName, i) {
    setTimeout(function() {
        console.log(testObject[propertyName]);
    }, i * 1000);
});

Я рекомендую этот метод.

Способ 2

Используйте bind:

var i = 0;
for (var propertyName in testObject) {
    setTimeout(function(propertyName) {
        console.log(testObject[propertyName]);
    }.bind(this, propertyName), i++ * 1000);
}

JSFiddle: http://jsfiddle.net/MsBkW/

Способ 3

Или, если вы не можете использовать forEach или bind, используйте IIFE:

var i = 0;
for (var propertyName in testObject) {
    setTimeout((function(propertyName) {
        return function() {
            console.log(testObject[propertyName]);
        };
    })(propertyName), i++ * 1000);
}

Метод 4

Но если вас не волнует IE ‹10, вы можете использовать предложение Фабио :

var i = 0;
for (var propertyName in testObject) {
    setTimeout(function(propertyName) {
        console.log(testObject[propertyName]);
    }, i++ * 1000, propertyName);
}

Метод 5 (ES6)

Используйте переменную с областью видимости блока:

let i = 0;
for (let propertyName in testObject) {
    setTimeout(() => console.log(testObject[propertyName]), i++ * 1000);
}

Хотя я все же рекомендую использовать Object.keys с forEach в ES6.

Хобблин уже прокомментировал этот вопрос, но это действительно должен быть ответ!

Использование Function.prototype.bind() - самый чистый и гибкий способ сделать это (с дополнительным бонусом в виде возможности установить контекст this):

setTimeout(postinsql.bind(null, topicId), 4000);

Для получения дополнительной информации см. Эти ссылки MDN:
https://developer.mozilla.org/en/docs/DOM/window.setTimeout#highlighter_547041 https://developer.mozilla.org/en/docs/JavaScript/Reference/Global_Objects/Function/bind#With_setTimeout

Некоторые ответы верны, но запутаны.

Я снова отвечаю на это, 4 года спустя, потому что я все еще сталкиваюсь с чрезмерно сложным кодом, чтобы решить именно этот вопрос. ЕСТЬ элегантное решение.

Прежде всего, не передавайте строку в качестве первого параметра при вызове setTimeout, потому что он эффективно вызывает вызов медленной функции «eval».

Так как же передать параметр функции тайм-аута? Используя закрытие:

settopic=function(topicid){
  setTimeout(function(){
    //thanks to closure, topicid is visible here
    postinsql(topicid);
  },4000);
}

...
if (xhr.readyState==4){
  settopic(xhr.responseText);
}

Некоторые предлагают использовать анонимную функцию при вызове функции тайм-аута:

if (xhr.readyState==4){
  setTimeout(function(){
    settopic(xhr.responseText);
  },4000);
}

Синтаксис работает. Но к моменту вызова settopic, то есть через 4 секунды, объект XHR может быть другим. Поэтому важно предварительно связать переменные.

Вы можете передать параметр функции обратного вызова setTimeout как:

setTimeout (функция, миллисекунды, параметр1, параметр2, ...)

eg.

function myFunction() {
  setTimeout(alertMsg, 3000, "Hello");
}

function alertMsg(message) {
    alert(message)
}

Я знаю, что прошло 10 лет с тех пор, как этот вопрос был задан, но все же, если вы прокрутили до этого места, я предполагаю, что вы все еще сталкиваетесь с какой-то проблемой. Решение Медера Омуралиева является самым простым и может помочь большинству из нас, но для тех, кто не хочет иметь никаких привязок, вот оно:

1. Используйте Param для setTimeout

setTimeout(function(p){
//p == param1
},3000,param1);

2. Использовать выражение немедленно вызываемой функции (IIFE)

let param1 = 'demon';
setTimeout(function(p){
    // p == 'demon'
},2000,(function(){
    return param1;
})()
);

3. Решение вопроса

function statechangedPostQuestion()
{
  //alert("statechangedPostQuestion");
  if (xmlhttp.readyState==4)
  {
    setTimeout(postinsql,4000,(function(){
        return xmlhttp.responseText;
    })());
  }
}

function postinsql(topicId)
{
  //alert(topicId);
}

Мой ответ:

setTimeout((function(topicId) {
  return function() {
    postinsql(topicId);
  };
})(topicId), 4000);

Объяснение:

Созданная анонимная функция возвращает другую анонимную функцию. Эта функция имеет доступ к первоначально переданному topicId, поэтому она не будет делать ошибки. Первая анонимная функция вызывается немедленно, передавая topicId, поэтому зарегистрированная функция с задержкой имеет доступ к topicId во время вызова через закрытие.

OR

Это в основном преобразуется в:

setTimeout(function() {
  postinsql(topicId); // topicId inside higher scope (passed to returning function)
}, 4000);

РЕДАКТИРОВАТЬ: я видел тот же ответ, поэтому посмотрите его. Но я не украл его ответ! Я просто забыл посмотреть. Прочтите объяснение и посмотрите, поможет ли оно понять код.

Заменять

 setTimeout("postinsql(topicId)", 4000);

с участием

 setTimeout("postinsql(" + topicId + ")", 4000);

или еще лучше, замените строковое выражение анонимной функцией

 setTimeout(function () { postinsql(topicId); }, 4000);

РЕДАКТИРОВАТЬ:

Комментарий Браунстоуна неверен, он будет работать так, как задумано, как показано, запустив его в консоли Firebug.

(function() {
  function postinsql(id) {
    console.log(id);
  }
  var topicId = 3
  window.setTimeout("postinsql(" + topicId + ")",4000); // outputs 3 after 4 seconds
})();

Обратите внимание, что я согласен с другими, что вам следует избегать передачи строки в setTimeout, поскольку это вызовет eval() в строке и вместо этого передаст функцию.

Самое простое кроссбраузерное решение для поддержки параметров в setTimeout:

setTimeout(function() {
    postinsql(topicId);
}, 4000)

Если вы не против не поддерживать IE 9 и ниже:

setTimeout(postinsql, 4000, topicId);

https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setTimeout

Я знаю, что он старый, но я хотел добавить к нему свой (предпочтительный) вкус.

Я думаю, что довольно удобочитаемый способ добиться этого - передать topicId функции, которая, в свою очередь, использует аргумент для внутренней ссылки на идентификатор темы. Это значение не изменится, даже если topicId снаружи изменится вскоре после этого.

var topicId = xmlhttp.responseText;
var fDelayed = function(tid) {
  return function() {
    postinsql(tid);
  };
}
setTimeout(fDelayed(topicId),4000);

или коротко:

var topicId = xmlhttp.responseText;
setTimeout(function(tid) {
  return function() { postinsql(tid); };
}(topicId), 4000);

Ответ Дэвида Мейстера, похоже, касается параметров, которые могут измениться сразу после вызова setTimeout (), но до вызова анонимной функции. Но это слишком громоздко и не очень очевидно. Я обнаружил элегантный способ сделать почти то же самое с помощью IIFE (немедленно вызываемое выражение функции).

В приведенном ниже примере переменная currentList передается в IIFE, который сохраняет ее при закрытии, пока не будет вызвана отложенная функция. Даже если переменная currentList изменится сразу после показанного кода, setInterval() поступит правильно.

Без этой техники IIFE функция setTimeout() определенно будет вызываться для каждого h2 элемента в DOM, но все эти вызовы будут видеть только текстовое значение последнего h2 элемента.

<script>
  // Wait for the document to load.
  $(document).ready(function() {
  $("h2").each(function (index) {

    currentList = $(this).text();

    (function (param1, param2) {
        setTimeout(function() {
            $("span").text(param1 + ' : ' + param2 );
        }, param1 * 1000);

    })(index, currentList);
  });
</script>

В общем, если вам нужно передать функцию как обратный вызов с определенными параметрами, вы можете использовать функции более высокого порядка. Это довольно элегантно с ES6:

const someFunction = (params) => () => {
  //do whatever
};

setTimeout(someFunction(params), 1000);

Или, если someFunction - первый заказ:

setTimeout(() => someFunction(params), 1000); 

Обратите внимание, что причина, по которой topicId был «не определен» в сообщении об ошибке, заключается в том, что он существовал как локальная переменная при выполнении setTimeout, но не при отложенном вызове postinsql. На время жизни переменной особенно важно обращать внимание, особенно когда вы пытаетесь передать что-то вроде "this" в качестве ссылки на объект.

Я слышал, что вы можете передать topicId в качестве третьего параметра функции setTimeout. Дается не так много подробностей, но у меня достаточно информации, чтобы заставить его работать, и он успешно работает в Safari. Я не знаю, что они имеют в виду под «миллисекундной ошибкой». Посмотрите здесь:

http://www.howtocreate.co.uk/tutorials/javascript/timers

Как я решил этот этап?

Просто так :

setTimeout((function(_deepFunction ,_deepData){
    var _deepResultFunction = function _deepResultFunction(){
          _deepFunction(_deepData);
    };
    return _deepResultFunction;
})(fromOuterFunction, fromOuterData ) , 1000  );

setTimeout ждет ссылки на функцию, поэтому я создал ее в закрытии, которое интерпретирует мои данные и возвращает функцию с хорошим экземпляром моих данных!

Возможно, вы можете улучшить эту часть:

_deepFunction(_deepData);

// change to something like :
_deepFunction.apply(contextFromParams , args); 

Я тестировал его на Chrome, Firefox и IE, и он работает хорошо, я не знаю о производительности, но мне нужно, чтобы он работал.

образец теста:

myDelay_function = function(fn , params , ctxt , _time){
setTimeout((function(_deepFunction ,_deepData, _deepCtxt){
            var _deepResultFunction = function _deepResultFunction(){
                //_deepFunction(_deepData);
                _deepFunction.call(  _deepCtxt , _deepData);
            };
        return _deepResultFunction;
    })(fn , params , ctxt)
, _time) 
};

// the function to be used :
myFunc = function(param){ console.log(param + this.name) }
// note that we call this.name

// a context object :
myObjet = {
    id : "myId" , 
    name : "myName"
}

// setting a parmeter
myParamter = "I am the outer parameter : ";

//and now let's make the call :
myDelay_function(myFunc , myParamter  , myObjet , 1000)

// this will produce this result on the console line :
// I am the outer parameter : myName

Возможно, вы можете изменить подпись, чтобы сделать ее более подходящей:

myNass_setTimeOut = function (fn , _time , params , ctxt ){
return setTimeout((function(_deepFunction ,_deepData, _deepCtxt){
            var _deepResultFunction = function _deepResultFunction(){
                //_deepFunction(_deepData);
                _deepFunction.apply(  _deepCtxt , _deepData);
            };
        return _deepResultFunction;
    })(fn , params , ctxt)
, _time) 
};

// and try again :
for(var i=0; i<10; i++){
   myNass_setTimeOut(console.log ,1000 , [i] , console)
}

И наконец, чтобы ответить на исходный вопрос:

 myNass_setTimeOut( postinsql, 4000, topicId );

Надеюсь, это поможет!

ps: извините, но английский это не мой родной язык!

это работает во всех браузерах (IE - чудак)

setTimeout( (function(x) {
return function() {
        postinsql(x);
    };
})(topicId) , 4000);

если вы хотите передать переменную в качестве параметра, попробуйте это

если требование - это функция, а var as parmas, попробуйте это

setTimeout((param1,param2) => { 
     alert(param1 + param2);
     postinsql(topicId);
},2000,'msg1', 'msg2')

if requirement is only variables as a params then try this

setTimeout((param1,param2) => { alert(param1 + param2) },2000,'msg1', 'msg2')

Вы можете попробовать это с ES5 и ES6

setTimeout является частью модели DOM, определенной WHAT WG.

https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html

Вам нужен следующий метод: -

handle = self.setTimeout( handler [, timeout [, arguments... ] ] )

Планирует тайм-аут для запуска обработчика после тайм-аута в миллисекундах. Любые аргументы передаются непосредственно обработчику.

setTimeout(postinsql, 4000, topicId);

Судя по всему, в IE10 поддерживаются дополнительные аргументы. В качестве альтернативы вы можете использовать setTimeout(postinsql.bind(null, topicId), 4000);, однако передача дополнительных аргументов проще и предпочтительнее.

Исторический факт: во времена VBScript в JScript третьим параметром setTimeout был язык в виде строки со значением по умолчанию «JScript», но с возможностью использования «VBScript». https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/aa741500(v%3Dvs.85)

Вы можете попробовать по умолчанию функцию «apply ()» примерно так, вы можете передать большее количество аргументов в соответствии с вашими требованиями в массиве

function postinsql(topicId)
{
  //alert(topicId);
}
setTimeout(
       postinsql.apply(window,["mytopic"])
,500);

Вам нужно удалить кавычки из вашего setTimeOut вызова функции следующим образом:

setTimeout(postinsql(topicId),4000);

@Jiri Vetyska благодарит за сообщение, но в вашем примере что-то не так. Мне нужно было передать цель, которая зависла (это), функции тайм-аута, и я попробовал ваш подход. Тестировал в IE9 - не работает. Я также провел некоторое исследование, и, похоже, как указано здесь, третий параметр - это язык сценария. быть использованным. Никаких упоминаний о дополнительных параметрах.

Итак, я последовал за ответом @meder и решил свою проблему с помощью этого кода:

$('.targetItemClass').hover(ItemHoverIn, ItemHoverOut);

function ItemHoverIn() {
 //some code here
}

function ItemHoverOut() {
    var THIS = this;
    setTimeout(
        function () { ItemHoverOut_timeout(THIS); },
        100
    );
}
function ItemHoverOut_timeout(target) {
    //do something with target which is hovered out
}

Надеюсь, это будет полезно для кого-то еще.

Поскольку существует проблема с третьим оптональным параметром в IE, а использование замыканий не позволяет нам изменить переменные (например, в цикле) и по-прежнему достичь желаемого результата, я предлагаю следующее решение.

Мы можем попробовать использовать рекурсию вот так:

var i = 0;
var hellos = ["Hello World1!", "Hello World2!", "Hello World3!", "Hello World4!", "Hello World5!"];

if(hellos.length > 0) timeout();

function timeout() {                
    document.write('<p>' + hellos[i] + '<p>');
    i++;
    if (i < hellos.length)
        setTimeout(timeout, 500);
}

Нам нужно убедиться, что ничто другое не изменяет эти переменные, и что мы написали правильное условие рекурсии, чтобы избежать бесконечной рекурсии.

// Это три очень простых и лаконичных ответа:

function fun() {
    console.log(this.prop1, this.prop2, this.prop3);
}

let obj = { prop1: 'one', prop2: 'two', prop3: 'three' };

let bound = fun.bind(obj);

setTimeout(bound, 3000);

 // or

function funOut(par1, par2, par3) {

  return function() { 

    console.log(par1, par2, par3);

  }
};

setTimeout(funOut('one', 'two', 'three'), 5000);

 // or

let funny = function(a, b, c) { console.log(a, b, c); };

setTimeout(funny, 2000, 'hello', 'worldly', 'people');

Я думаю, ты хочешь:

setTimeout("postinsql(" + topicId + ")", 4000);

// Это три очень простых и лаконичных ответа:

function fun() {
    console.log(this.prop1, this.prop2, this.prop3);
}

let obj = { prop1: 'one', prop2: 'two', prop3: 'three' };

let bound = fun.bind(obj);

setTimeout(bound, 3000);

 // or

function funOut(par1, par2, par3) {

  return function() { 

    console.log(par1, par2, par3);

  }
};

setTimeout(funOut('one', 'two', 'three'), 5000);

 // or

let funny = function(a, b, c) { console.log(a, b, c); };

setTimeout(funny, 2000, 'hello', 'worldly', 'people');

Отвечая на вопрос, но с помощью простой функции сложения с двумя аргументами.

var x = 3, y = 4;

setTimeout(function(arg1, arg2) { 
      delayedSum(arg1, arg2);
}(x, y), 1000);

function delayedSum(param1, param2) {
     alert(param1 + param2); // 7
}