想要模式以便在JavaScript中將函數參數傳遞給setTimeout調用的最佳方法

Question

我正在努力將傳遞給函數的所有參數傳遞給setTimeout的函數的最佳方法。 也就是說，在我下面的例子中，我傳遞了一個參數，但在我看來，因為它變得更復雜，它變得丑陋（多個參數）。 因為我做了很多，所以我希望有一個干凈的模式來做這件事。

onSessionTimeComboChange: function (combo, newValue, oldValue, eOpts) {
    var me = this;
    me.newValue = newValue;
    setTimeout(function () {
        var x = me.newValue;
        debugger;
    }, 100);
}

Answer 1

您無法訪問回調函數中的主函數變量的原因是setTimeout()執行的代碼在一個單獨的執行上下文中運行，該函數從中調用它。 簡單來說， this在回調中是不一樣的。

如果您不想使用提供函數的Javascript庫將回調綁定到上下文（請參閱jQuery.proxy和underscore.bind ），則必須編寫自己的非本機setTimeout函數來解決此問題。

以下是web api文檔中提出的解決方案（請參閱The "this" problem ）：

window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
  return __nativeST__(vCallback instanceof Function ? function () {
    vCallback.apply(oThis, aArgs);
  } : vCallback, nDelay);
};

如果你不想那么做，你的代碼的改進就是將參數作為setTimeout的參數傳遞給回調：

var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);

查看JavaScript web api以獲取更多詳細信息。

所以在你的例子中，你可以寫下這樣的東西：

setTimeout(function (x) {
    debugger;
}, 100, newValue);

Answer 2

Javascript支持閉包，因此您可以毫不費力地將所需的任何參數傳遞給任何回調：

function bar(x, y, z) {
    console.log([x, y, z]);
}

for (var i=0; i<5; i++) {
    (function(x, y, z){
        setTimeout(function(){bar(x, y, z);}, i*1000+1000);
     })(i, i*2, i*3);
}

唯一棘手的部分是你不能只說

setTimeout(function(){bar(i, i*2, i*3)}, i*1000+1000);

因為閉包捕獲變量 （而不是當前值），所以在這種情況下，所有已注冊的函數實際上將使用相同的i值。