Bir parametreyi setTimeout () geri aramasına nasıl iletebilirim?

Şuna benzeyen bazı JavaScript kodu var:

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

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

topicIdTanımlı olmayan bir hata alıyorum setTimeout()İşlevi kullanmadan önce her şey çalışıyordu .

Bir postinsql(topicId)süre sonra fonksiyonumun çağrılmasını istiyorum . Ne yapmalıyım?

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

Anonim bir işlevi bir dize yerine parametre olarak beslemeniz gerekir, ikinci yöntem ECMAScript belirtimine göre çalışmamalıdır, ancak tarayıcılar sadece yumuşaktır. Bu uygun bir çözümdür, kullanırken bir dizeyi 'işlev' olarak geçirmeye asla güvenmeyin setTimeout()ya setInterval()da değerlendirilmesi gerekir ve doğru değildir.

GÜNCELLEME:

Hobblin'in soruya yaptığı yorumlarında söylediği gibi , artık setTimeout kullanarak işleve argümanlar iletebilirsiniz Function.prototype.bind().

Misal:

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

Modern tarayıcılarda "setTimeout", zamanlayıcının sonunda dahili işleve parametre olarak gönderilen üçüncü bir parametre alır.

Misal:

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

Daha fazla detay:

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

Biraz araştırma ve test yaptıktan sonra tek doğru uygulama:

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

setTimeout tüm ekstra parametreleri fonksiyonunuza iletir, böylece orada işlenebilirler.

Anonim işlev çok temel şeyler için çalışabilir, ancak "this" i kullanmak zorunda olduğunuz bir nesne içinde çalışmasını sağlamanın bir yolu yoktur. Herhangi bir anonim işlev "this" i pencereye işaret edecek şekilde değiştirir, böylece nesne referansınızı kaybedersiniz.

Bu zaten "doğru" bir cevabı olan çok eski bir soru ama burada kimsenin bahsetmediği başka bir yaklaşımdan söz edeceğimi düşündüm. Bu mükemmel alt çizgi kütüphanesinden kopyalanır ve yapıştırılır :

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

SetTimeout tarafından çağrılan işleve istediğiniz kadar argüman iletebilirsiniz ve setTimeout'u çağırdığınızda işlevinize iletilen bağımsız değişkenlerin değeri setTimeout'u çağırdığınızda dondurulur; setTimeout () çağrıldığında ve zaman aşımına uğradığında, bu ... artık çok sinir bozucu değil :)

İşte ne demek istediğimi görebileceğiniz bir keman .

Son zamanlarda setTimeoutbir döngüde a kullanmaya ihtiyaç duyduğu benzersiz duruma rastladım . Bunu anlamak, parametreleri nasıl aktaracağınızı anlamanıza yardımcı olabilir setTimeout.

Yöntem 1

Sukima'nın önerisine göre forEachve kullanın :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);
});

Bu yöntemi tavsiye ederim.

Yöntem 2

Kullanım 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/

Yöntem 3

Veya kullanamıyorsanız forEachveya bindbir IIFE kullanın :

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

Yöntem 4

Ancak IE <10'u umursamıyorsanız, Fabio'nun önerisini kullanabilirsiniz :

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

Yöntem 5 (ES6)

Blok kapsamındaki bir değişkeni kullanın:

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

Yine de ES6 Object.keysile kullanmanızı tavsiye ederim forEach.

Hobblin bunu zaten soru üzerine yorumladı, ama gerçekten bir cevap olmalı!

Kullanılması Function.prototype.bind()(ayarlamak mümkün olan avantaj ile bunu yapmak en temiz ve en esnek yoldur thisbağlamı):

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

Daha fazla bilgi için şu MDN bağlantılarına bakın:
https://developer.mozilla.org/en/docs/DOM/window.setTimeout#highlighter_547041 https://developer.mozilla.org/en/docs/JavaScript/Reference/Global_Objects/Function / bağlama # With_setTimeout

Bazı cevaplar doğru ama kıvrıktır.

Bu soruyu 4 yıl sonra tekrar cevaplıyorum, çünkü tam olarak bu soruyu çözmek için aşırı karmaşık kodlarla karşılaşıyorum. Zarif bir çözüm var.

Her şeyden önce, yavaş bir "eval" işlevine etkili bir çağrı çağırdığından, setTimeout çağrılırken ilk parametre olarak bir dizeyi iletmeyin.

Peki bir parametreyi zaman aşımı fonksiyonuna nasıl geçiririz? Kapanış kullanarak:

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

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

Bazıları zaman aşımı işlevini çağırırken anonim işlev kullanılmasını önerdi:

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

Sözdizimi işe yarıyor. Ancak settopik çağrıldığında, yani 4 saniye sonra, XHR nesnesi aynı olmayabilir. Bu nedenle değişkenleri önceden bağlamak önemlidir .

Cevabım:

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

Açıklama:

Oluşturulan anonim işlev başka bir anonim işlev döndürür. Bu işlevin başlangıçta iletilene erişimi vardır topicId, bu nedenle hata yapmaz. İlk anonim işlev hemen çağrılır, iletilir topicId, bu nedenle gecikmeli kayıtlı işleve erişimtopicId , içeri aktarılır , çağrı sırasında, kapaklar aracılığıyla .

VEYA

Bu temel olarak şuna dönüşür:

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

EDIT: Aynı cevabı gördüm, bu yüzden ona bakın. Ama cevabını çalmadım! Sadece bakmayı unuttum. Açıklamayı okuyun ve kodun anlaşılmasına yardımcı olup olmadığını görün.

değiştirmek

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

ile

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

veya daha iyisi, dize ifadesini anonim bir işlevle değiştirin

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

DÜZENLE:

Brownstone'un yorumu yanlış, Firebug konsolunda çalıştırarak gösterildiği gibi, bu amaçlandığı gibi çalışacaktır

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

setTimeoutBu eval()dize çağıracak ve bunun yerine bir işlevi geçirecek gibi bir dize geçirmekten kaçınmalısınız diğerleri ile anlaşıyorum .

Parametreyi setTimeout geri arama işlevine şu şekilde aktarabilirsiniz:

setTimeout (işlev, milisaniye, param1, param2, ...)

Örneğin.

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

function alertMsg(message) {
    alert(message)
}

SetTimeout'ta parametreleri desteklemek için en kolay çapraz tarayıcı çözümü:

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

IE 9 ve daha düşük sürümleri desteklememenizin sakıncası yoksa:

setTimeout(postinsql, 4000, topicId);

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

Bu soru sorulduğundan beri 10 yıl geçtiğini biliyorum, ama yine de, buraya kadar kaydırdıysanız, hala bazı sorunlarla karşı karşıya olduğunuzu varsayıyorum. Meder Omuraliev'in çözümü en basit olanıdır ve çoğumuza yardımcı olabilir, ancak herhangi bir bağlanmak istemeyenler için burada:

1. SetTimeout için Param kullanın

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

2. Hemen Çağırılan İşlev İfadesini Kullan (IIFE)

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

3. Sorunun çözümü

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

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

Eski olduğunu biliyorum ama buna (tercih edilen) lezzetimi eklemek istedim.

Bunu başarmak için oldukça okunabilir bir yol topicId, sırayla konu kimliğini dahili referans için argüman kullanan bir işleve geçmek olduğunu düşünüyorum . topicIdKısa bir süre sonra dışarıdan değiştirilse bile bu değer değişmez .

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

veya kısa:

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

David Meister'ın cevabı, setTimeout () çağrısından hemen sonra ancak anonim işlev çağrılmadan önce değişebilecek parametrelerle ilgileniyor gibi görünüyor. Ama çok hantal ve çok açık değil. IIFE'yi kullanarak hemen hemen aynı şeyi yapmanın zarif bir yolunu keşfettim (hemen işlev ifadesi).

Aşağıdaki örnekte, currentListdeğişken, gecikmeli fonksiyon çağrılıncaya kadar kapanmasına kaydeden IIFE'ye geçirilir. Değişken currentListgösterilen koddan hemen sonra değişse bile ,setInterval() , doğru olanı yapar.

Bu IIFE tekniği olmadan, setTimeout()işlev DOM'daki her h2öğe için kesinlikle çağrılacaktır , ancak tüm bu çağrılar yalnızca son h2 öğenin metin değerini görecektir .

<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>

Genel olarak, bir işlevi belirli parametrelerle geri arama olarak iletmeniz gerekiyorsa, daha yüksek dereceli işlevleri kullanabilirsiniz. Bu ES6 ile oldukça zarif:

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

setTimeout(someFunction(params), 1000);

Veya someFunctionilk sipariş ise:

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

TopicId'nin hata mesajı başına "tanımlanmadığı" nedeninin, setTimeout yürütüldüğünde yerel bir değişken olarak var olduğunu, ancak postinsql'e gecikmeli çağrı gerçekleştiğinde olmadığını unutmayın. Değişken yaşam, özellikle bir nesne referansı olarak "bu" iletmek gibi bir şey denerken özellikle dikkat edilmesi önemlidir.

SetTimeout işlevine üçüncü bir parametre olarak topicId iletebildiğini duydum. Çok fazla ayrıntı verilmiyor, ancak çalışmasını sağlamak için yeterli bilgiye sahibim ve Safari'de başarılı. Gerçi "milisaniye hatası" hakkında ne demek bilmiyorum. Buradan kontrol edin:

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

Bu aşamayı nasıl çözdüm?

aynen böyle :

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

setTimeout bir işleve bir referans beklemek, bu yüzden benim verileri yorumlamak ve verilerimin iyi bir örneği ile bir işlev döndürmek, bir kapatma oluşturdu!

Belki bu kısmı geliştirebilirsiniz:

_deepFunction(_deepData);

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

Ben krom, firefox ve IE üzerinde test ve iyi yürütmek, ben performans hakkında bilmiyorum ama çalışması gerekiyordu.

bir örnek testi:

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

Belki imzayı daha uyumlu hale getirmek için değiştirebilirsiniz:

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)
}

Ve son soruya orijinal soruyu cevaplamak için:

 myNass_setTimeOut( postinsql, 4000, topicId );

Umarım yardımcı olabilir!

ps: üzgünüm ama ingilizce bu benim ana dilim değil!

bu tüm tarayıcılarda çalışır (IE tuhaftır)

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

Eğer değişkeni param olarak iletmek istiyorsanız bunu deneyelim

gereksinim işlevse ve parmas olarak var ise bunu deneyin

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

gereksinim yalnızca parametre olarak değişkense bunu deneyin

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

Bunu ES5 ve ES6 ile deneyebilirsiniz

Bunun gibi 'Apply ()' işlevinin varsayılan işlevselliğini deneyebilir, dizide gereksiniminiz olarak daha fazla sayıda argüman iletebilirsiniz

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

setTimeout, WHAT WG tarafından tanımlanan DOM'nin bir parçasıdır.

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

İstediğiniz yöntem: -

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

Zaman aşımı milisaniyesinden sonra işleyiciyi çalıştırmak için bir zaman aşımı zamanlar. Tüm argümanlar doğrudan işleyiciye aktarılır.

setTimeout(postinsql, 4000, topicId);

Görünüşe göre, IE10'da ekstra argümanlar desteklenmektedir. Alternatif olarak, kullanabilirsiniz setTimeout(postinsql.bind(null, topicId), 4000);, ancak ekstra argümanlar geçirmek daha basittir ve bu tercih edilir.

Geçmiş factoid: VBScript günlerinde, JScript'te, setTimeout'un üçüncü parametresi dize olarak varsayılan olarak "JScript" olarak kullanılan, ancak "VBScript" kullanma seçeneğiyle dildi. https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/aa741500(v%3Dvs.85)

@ Jiri Vetyska gönderi için teşekkürler, ancak örneğinizde bir sorun var. Üzerine gelinen hedefi (bu) zaman aşımına uğramış bir işleve geçirmem gerekiyordu ve yaklaşımınızı denedim. IE9'da test edilmiştir - çalışmaz. Ayrıca biraz araştırma yaptım ve burada da belirtildiği gibi görünüyor belirtildiği gibi üçüncü parametre kullanılan kod dilidir. Ek parametrelerden bahsedilmiyor.

Böylece, @ meder'ın cevabını takip ettim ve bu kodla ilgili sorunumu çözdüm:

$('.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
}

Umarım bu başka biri için yararlıdır.

IE'deki üçüncü optonal parametresiyle ilgili bir sorun olduğundan ve kapanışların kullanılması değişkenleri değiştirmemizi (örneğin bir döngüde) ve yine de istenen sonucu elde etmemizi önlediğinden, aşağıdaki çözümü öneririm.

Şu şekilde özyineleme kullanmayı deneyebiliriz:

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);
}

Bu değişkenleri başka hiçbir şeyin değiştirmediğinden ve sonsuz tekrarlamayı önlemek için uygun bir özyineleme koşulu yazdığımızdan emin olmalıyız.

// Bunlar çok basit ve özlü üç cevaptır:

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');

Soruyu cevaplamak ama 2 argüman ile basit bir ekleme fonksiyonu.

var x = 3, y = 4;

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

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

TırnaklarısetTimeOut işlev çağrınızdan şu şekilde kaldırmanız gerekir :

setTimeout(postinsql(topicId),4000);

Bence sen istiyorsun:

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

// Bunlar çok basit ve özlü üç cevaptır:

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');