看<<高性能 JavaScript>>这本书的时候,里面有个例子吸引了我,于是我写了个简化版本
function save() {
var task = [1, 2, 3, 4, 5];
setTimeout(() => {
let e = task.shift();
console.log('e: ', e);
if (task.length > 0) {
setTimeout(arguments.callee, 25);
}
}, 25);
}
结果和书上执行结果不一样。调用 save 方法一直输出 e: 1
发现原来我习惯性的用了剪头函数,导致 arguments.callee 找到的方法错了。
修改后:
function save(id) {
var task = [1, 2, 3, 4, 5];
setTimeout(function() {
let e = task.shift();
console.log('e: ', e);
if (task.length > 0) {
setTimeout(arguments.callee, 25);
}
}, 25);
}
正常输出了
e: 1
e: 2
e: 3
e: 4
e: 5
使用剪头函数导致 setTimeout(arguments.callee, 25); 中 arguments.callee 是 save 方法, 而修改后的代码 arguments.callee 是第一个 setTime 中的回调方法。