SetTimeout - 为什么传递函数比字符串更好?

时间:2014-08-12 07:45:29

标签: javascript

我用过

setTimeout('InitData()', 100);

但JSHint告诉我"使用函数比字符串"更好。我把它改成了:

setTimeout(function () { InitData() }, 100);

但为什么会这样呢?

1 个答案:

答案 0 :(得分:3)

有几个原因。

  1. 主要是,当您传递setTimeout字符串时,将在全局上下文中评估字符串。这意味着它调用的函数必须是一个全局函数。避免使用全局变量是一种很好的做法。

    例如,此操作失败:Live Example (请参阅控制台中的错误)

    (function() {
       "use strict";
    
       setTimeout("display('hi');", 0);
    
       function display(msg) {
         var p = document.createElement('p');
         p.innerHTML = String(msg);
         document.body.appendChild(p);
       }
    })();
    

    ...因为display不是全局函数。

    但这有效:Live Example

    (function() {
      "use strict";
    
      setTimeout(display.bind(null, 'hi'), 0);
      // Or:
      // setTimeout(function() { display('hi'); }, 0);
    
      function display(msg) {
        var p = document.createElement('p');
        p.innerHTML = String(msg);
        document.body.appendChild(p);
      }
    })();
    
  2. 使用函数引用而不是字符串意味着我们使用相同的语义我们在其他任何地方使用回调,而不是让调用setTimeout有些奇怪特别的东西。例如,我给addEventListener一个函数在事件发生时调用的方式与我给setTimeout函数在超时时调用的方式相同。一致的语义有助于避免错误。

  3. 使用函数引用而不是字符串让我对我正在调用的函数非常具体。考虑:

    function showInASecond(str) {
      setTimeout(function() {
        alert(str);
      }, 1000);
    }
    

    我无法在那里合理地使用字符串。哦,我可以尝试创建一个连接,确保逃避我必须在str中逃脱的所有内容(如引号,反斜杠等),但简单就更好了。

  4. 如果你传递setTimeout一个字符串,它必须启动一个完整的JavaScript解析器来评估它。问题不多,但仍需要更多的工作。