为何JSHint会警告循环内声明的函数调用外部函数？

你的判断是对的，这两个场景确实存在本质区别，我们可以拆解来看：

两种场景的核心差异 #

1. 引用固定外层函数的场景
   你第一段代码中，循环内创建的bar函数引用的是外层作用域中固定不变的foo函数：

   function foo () {}
   
   let data = [];
   
   for (let x of data)
   {
     let bar = function ()
     {
       foo ();
     };
   }
   

   这里的foo是全局/外层作用域的固定标识符，无论循环迭代多少次，bar引用的都是同一个foo，不会产生语义混淆或意外行为。

2. 引用循环迭代变量的场景
   第二段代码中，函数引用的是循环的迭代变量table：

   for (let table of document.getElementsByTagName("table"))
   {
     table.my_function = function ()
     {
        do_something_with (table);
     };
   }
   

   早期用var声明迭代变量时，所有函数会绑定同一个变量，导致异步调用时出现错误；现在用let的话，for-of循环会为每次迭代创建独立作用域，每个my_function绑定的是当前迭代的table，但这类模式依然存在潜在的语义混淆风险。

JSHint警告的逻辑 #

JSHint的这条警告是泛化的模式检查——只要检测到循环内声明的函数引用了外层作用域的变量，就会触发提醒，它并没有区分这个变量是固定不变的（比如foo）还是随循环变化的迭代变量。这种设计是为了覆盖所有可能存在风险的场景，但难免会出现“过度敏感”的情况。

是否需要重视这个警告 #

• 对于你第一个场景的代码：完全可以忽略该警告。因为foo是固定的外层函数，不存在语义混淆或bug风险，JSHint的提醒属于误判。你可以通过配置JSHint规则（比如添加/* jshint loopfunc: false */注释）来关闭这条特定警告。
• 对于引用循环迭代变量的场景：需要重视。即便用了let，如果涉及异步操作（比如在函数中延迟调用do_something_with(table)），依然可能出现变量引用问题，这时候JSHint的警告能帮你提前规避风险。

内容的提问来源于stack exchange，提问作者spraff