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

SetTimeout - why is passing a function better then a string?

本文关键字:字符串 更好 为什么 传递函数 SetTimeout      更新时间:2023-09-26

我用

setTimeout('InitData()', 100);

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

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

为什么会这样呢?

原因如下:

  1. 首先,当您向setTimeout传递字符串时,该字符串将在全局上下文中求值。这意味着它调用的函数必须是一个全局函数。避免全局变量是个好习惯。

    示例(请参阅控制台中的错误)
    (function() {
       "use strict";
       setTimeout("display('hi');", 0);
       function display(msg) {
         var p = document.createElement('p');
         p.innerHTML = String(msg);
         document.body.appendChild(p);
       }
    })();
    

    …因为display不是一个全局函数。

    但这是有效的:

    (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解析器来计算它。没有太大的问题,但仍然比需要做更多的工作。