浏览器中 for i ,let i= 0 的坑

612 阅读1分钟

众所周知在浏览器中使用es6语法需要bable转换,

在 for i 循环中如果使用let声明i会存在问题

for(let i =0;i<max;i++){}

在bable 转换之后上边代码会变成

for(var i=0;i<max;i++){

 var ref  =   loop(i)

}

如果不使用continue,并且不在循环体内改变下标是没有问题的但是如果有这样的写法

let arr = [1,2,3,4,5]for(let i =0;i<arr.length;i++){
   if(arr[i]===2){
      arr.splice(i,1,2)
      i--
     continue     
   }   }

上边代码会被bable编译成

 
var arr = [1,2,3,4,5]function loop(_i){  if(arr[i]===2){
      arr.splice(i,1,2)
    _i--     return 'continue'     
   } 
   i = _i}for(var i=0;i<arr.length;i++){ var ref  =   loop(i)
 if(ref === 'continue' ) continue}

可以看出在loop函数中return 'continue'之前 并没有将_i的值赋值给i,所以for 循环中的i并没有--

避免编译成这种就是直接使用for(var i = 0;i<max;i++)