let for循环

for循环表达式中使用let声明表达式变量
因为let有自己的作用域块,所以在for循环表达式中使用let其实就等价于在代码块中使用let,也就是说

for( let i = 0; i< 5; i++) 这句话的圆括号之间,有一个隐藏的作用域
for( let i = 0; i< 5; i++) { 循环体 } 在每次执行循环体之前,JS 引擎会把 i 在循环体的上下文中重新声明及初始化一次。
var liList = document.querySelectorAll('li') // 共5个li
for(let i = 0;i<liList.length;i++){
 liList[i].onclick = function(){
    //这里的i是循环结束的i,因为监听事件是异步
    console.log(i)//0 1 2 3 4
  }
}
//上面代码其实就等价于
for (let i = 0;i<liList.length;i++){
 let i = 隐藏作用域中的i(表达式中的i)
 liList[i].onclick = function(){
    console.log(i)
 }
}
//你也可以在代码块中使用另一个let变量接受每一个i
for(let i = 0;i<liList.length;i++){
 //这里能很直观的看出j有自己的作用域
 let j = i;
 liList[j].onclick = function(){
    console.log(j)
 }
}
//你也可以当成是声明了五个let块级作用域
{let i = 0}
{let i = 1}
{let i = 2}
{let i = 3}
{let i = 4}
因为let在代码块中都有自己的作用域,所以在for循环中的表达式中使用let它的每一个值都会单独存在一个独立的作用域中不会被覆盖掉。

for(let i = 0; i<5;i++){
  setTimeout(()=>console.log(i),0)//0 1 2 3 4
}

你可能感兴趣的:(javascript)