问题描述: 在WebSocket环境中执行makeAttacks函数出现问题。
代码示例:
function makeAttacks() {
for (var i = 0; i < 10; i++) {
setTimeout(function() {
console.log('Attack #' + i);
}, 1000);
}
}
makeAttacks();
解决方法: 该问题是由于JavaScript的闭包和setTimeout函数的异步特性导致的。在makeAttacks函数中,setTimeout函数会在循环结束后才执行,而循环结束时,i的值已经是10。因此,每次执行setTimeout时,输出的i的值都是10。
为了解决这个问题,可以使用IIFE(立即执行函数表达式)来创建一个新的作用域,并在每次循环中将i的值传递给setTimeout函数。
修改后的代码示例:
function makeAttacks() {
for (var i = 0; i < 10; i++) {
(function(index) {
setTimeout(function() {
console.log('Attack #' + index);
}, 1000);
})(i);
}
}
makeAttacks();
在修改后的代码中,通过立即执行函数表达式创建了一个新的作用域,并将i的值传递给了index参数。这样,每次循环时,都会创建一个新的作用域,并将对应的index值传递给setTimeout函数,确保输出的i的值是正确的。
运行修改后的代码,输出结果会按照预期输出:
Attack #0
Attack #1
Attack #2
...
Attack #9