javascript - 隐式声明 'let' 对带递归的 for 循环变量有什么影响？

Question

所以我有一个函数的示例代码，它通过递归遍历数组及其所有子数组，并计算找到的匹配字符串的数量。

示例数组:

const array = [
    'something',
    'something',
    [
        'something',
        'something'
    ],
    'something',
    [
        'something',
        [
            'something',
            'something'
        ],
        'something',
        [
            [
                'something',
                'something',
                [
                    'anything'
                ]
            ],
            'something',
        ],
        [
            'something',
            [
                'something',
                'something',
                'something',
                [
                    'anything',
                    'something',
                    [
                        'something',
                        'anything'
                    ]
                ]
            ]
        ]
    ],
    'anything'
];

我的函数可以遍历这个数组并计算其中“某物”的数量。

此代码运行良好:

let somethingsFound = 0;
const searchArrays = (array, stringMatch) => {
    for(let i=0;i<array.length;i++){
        const item = array[i];
        if((typeof item) === 'string'){
            (item === stringMatch) ? somethingsFound++ : undefined;
        } else if ((typeof item) === 'object'){
            searchArrays(item, stringMatch);
        }
    }
}

searchArrays(array, 'something');
console.log(`Found ${somethingsFound} somethings`);

控制台输出:

>Found 18 somethings

但是这是我不明白的部分，需要一些解释。如果我删除 let关于forloop的声明变量 i并隐式声明它 i=0;<array.length;i++然后我的函数进入无限递归。我通过放置 console.log("running search) 检查了它声明并看到了。

在这种情况下 let 究竟做了什么？我已经尝试阅读它，但不太了解发生了什么，以及递归和 forloop 究竟是如何相互作用的。

这里是失败的代码块以防万一，不同之处在于 let 声明:

let somethingsFound = 0;
const searchArrays = (array, stringMatch) => {
    for(i=0;i<array.length;i++){
        const item = array[i];
        if((typeof item) === 'string'){
            (item === stringMatch) ? somethingsFound++ : undefined;
        } else if ((typeof item) === 'object'){
            searchArrays(item, stringMatch);
        }
    }
}

searchArrays(array, 'something');
console.log(`Found ${somethingsFound} somethings`);

谢谢! CodeAt30

Answer 1

...and just implicitly declare it i=0;

这不是声明，它只是创建一个 implicit global *。因为它是一个global，所有对searchArrays 的调用都共享它，因此您的外部调用会过早结束(因为i 已递增你内心的呼唤)。

例子:

function withDeclaration(recurse) {
  for (let i = 0; i < 3; ++i) {
    console.log((recurse ? "Outer " : "Inner ") + i);
    if (recurse) {
      withDeclaration(false);
    }
  }
}
function withoutDeclaration(recurse) {
  for (i = 0; i < 3; ++i) {
    console.log((recurse ? "Outer " : "Inner ") + i);
    if (recurse) {
      withoutDeclaration(false);
    }
  }
}

console.log("With declaration:");
withDeclaration(true);
console.log("Without declaration:");
withoutDeclaration(true);

.as-console-wrapper {
  max-height: 100% !important;
}

故事的寓意:永远不要依赖隐式全局变量。在您需要它们的最内层范围内声明您的变量。使用 "use strict" 使隐式全局创建成为错误。

---

* (这是我贫血的小博客上的帖子)