Skip to content

改造下面的代码,让它输出1,2,3,4,5

for(var i = 1; i <= 5; i ++){ setTimeout(function timer(){ console.log(i) }, 0) }

解决方法:

  • 利用IIFE(立即执行函数表达式)当每次for循环时,把此时的i变量传递到定时器中
js
for(var i = 1;i <= 5;i++){
  (function(j){
    setTimeout(function timer(){
    	console.log(j)
    }, 0)
  })(i)
}
  • 给定时器传入第三个参数, 作为timer函数的第一个函数参数
js
for(var i=1;i<=5;i++){
  setTimeout(function timer(j){
  	console.log(j)
  }, 0, i)
}
  • 使用ES6中的let
js
for(let i = 1; i <= 5; i++){
  setTimeout(function timer(){
 	 console.log(i)
  },0)
}

let使JS发生革命性的变化,让JS有函数作用域变为了块级作用域,用let后作用域链不复存在。