no-loop-func

禁止在循环语句中包含不安全引用的函数声明

在循环中编写函数往往会导致错误，因为函数会在循环周围创建一个闭包。例如

for (var i = 0; i < 10; i++) {
    funcs[i] = function() {
        return i;
    };
}
1
2
3
4
5

在这种情况下，您会期望循环中创建的每个函数都返回不同的数字。实际上，每个函数都返回 10，因为这是 i 在作用域中的最后一个值。

let 或 const 缓解了这个问题。

for (let i = 0; i < 10; i++) {
    funcs[i] = function() {
        return i;
    };
}
1
2
3
4
5

在这种情况下，循环中创建的每个函数都按预期返回不同的数字。

规则详情

此错误被提出是为了强调可能无法按预期工作的一段代码，也可能表明对语言工作原理的误解。如果未修复此错误，您的代码可能会运行而没有任何问题，但在某些情况下它可能会表现出意外的行为。

此规则禁止循环中任何包含不安全引用（例如，对来自外部作用域的修改变量的引用）的函数。此规则会忽略 IIFE，但不会忽略异步函数或生成器函数。

此规则的不正确代码示例

在游乐场中打开

/*eslint no-loop-func: "error"*/

var i = 0;
while(i < 5) {
    var a = function() { return i; };
    a();

    i++;
}

var i = 0;
do {
    function a() { return i; };
    a();

    i++
} while (i < 5);

let foo = 0;
for (let i = 0; i < 10; ++i) {
    //Bad, `foo` is not in the loop-block's scope and `foo` is modified in/after the loop
    setTimeout(() => console.log(foo));
    foo += 1;
}

for (let i = 0; i < 10; ++i) {
    //Bad, `foo` is not in the loop-block's scope and `foo` is modified in/after the loop
    setTimeout(() => console.log(foo));
}
foo = 100;

var arr = [];

for (var i = 0; i < 5; i++) {
    arr.push((f => f)(() => i));
}

for (var i = 0; i < 5; i++) {
    arr.push((() => {
        return () => i;
    })());
}

for (var i = 0; i < 5; i++) {
    (function fun () {
        if (arr.includes(fun)) return i;
        else arr.push(fun);
    })();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

此规则的正确代码示例

在游乐场中打开

/*eslint no-loop-func: "error"*/

var a = function() {};

for (var i=10; i; i--) {
    a();
}

for (var i=10; i; i--) {
    var a = function() {}; // OK, no references to variables in the outer scopes.
    a();
}

for (let i=10; i; i--) {
    var a = function() { return i; }; // OK, all references are referring to block scoped variables in the loop.
    a();
}

var foo = 100;
for (let i=10; i; i--) {
    var a = function() { return foo; }; // OK, all references are referring to never modified variables.
    a();
}
//... no modifications of foo after this loop ...

var arr = [];

for (var i=10; i; i--) {
    (function() { return i; })();
}

for (var i = 0; i < 5; i++) {
    arr.push((f => f)((() => i)()));
}

for (var i = 0; i < 5; i++) {
    arr.push((() => {
        return (() => i)();
    })());
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

版本

此规则是在 ESLint v0.0.9 中引入的。

资源

编辑此页面