ES6循环内变量声明的浏览器行为：是否重用或重复分配内存？

此前关于变量声明位置的讨论多基于ES5的函数作用域假设，普遍认为在循环内声明变量可读性更高。但ES6引入块级作用域变量（let/const）后，这个问题有必要重新探讨——目前尚无确切结论能明确编译器的具体行为，这仍是一个待解的问题。

参考示例代码 #

function foo(array) {
    const dictionary = {'a', 'b', 'c'};
    let currentElement;

    for (let i = 0; i < 10000; i++) {
        currentElement = (dictionary[array[i]]) ? someObj.foo : null;
    }
}

// 对比写法
function foo(array) {
    for (let i = 0; i < 10000; i++) {
        const dictionary = {'a', 'b', 'c'};
        let currentElement = (dictionary[array[i]]) ? someObj.foo : null;
    }
}

核心疑问 #

• 现代浏览器的具体处理行为是什么？
• 浏览器是否会重用循环内的变量声明？重用的程度如何？
• 是否存在浏览器会在每次循环时重新分配变量并触发垃圾回收？

此前相关讨论大多是无依据的主观假设，缺乏实际验证。

对主流观点的回应 #

针对“该场景性能收益可忽略，应优先在循环内声明变量”的观点，我认为这种写法上的“优化”没有任何额外成本，将其纳入编码规范长期来看只会带来益处。就像面对两个苹果，一个有5%的概率变质，显然会选择大概率完好的那个。

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