2

在编程语言中一般都会使用到for循环这个方法,来一起了解一下for循环有意思的地方

原生js的for循环使用

for(var i = 0; i < 6; i++) {
    //do something
}
console.log(i) // 6

由于在原生的js中没有块级作用域这个说法,所以即使是在for循环中定义的i,在for循环之外也是能够访问到i这个变量

引入ES6的let来定义变量

for(let i = 0; i < 6; i++) {
    //do something
}
console.log(i) // Uncaught ReferenceError: i is not defined

这里会显示一个i为未定义的引用报错,因为这次的i是通过let来进行定义的变量
let是ES6中新引入的一个定义变量的方法,这个方法可以使得定义的变量属于块级作用域(一对大括号包起来算是块级作用域).在块级作用域外不能访问变量

更有意思的部分

for(let i = 0; i < 6; i++) {
    let i = 'ace';
    console.log(i); // 输出6次ace
}

可以在这看到在for的作用域中定义了一个新的i,并且打印出当前作用域i出来.引入一个内容

let i = 0; 
let i = 'ace'; //Uncaught SyntaxError: Identifier 'i' has already been declared

这里会报错,因为用let定义的变量不能够重复进行声明
所以大胆猜测一下,但是没有进行验证,上面循环的形式大概是这样子的

{
    let i = 0; // 循环前数值的初始化
    {
        // 执行循环内的函数
        let i = 'ace'; 
        console.log(i);  // 在这里可以看到前后两个i的作用域是不一样的,当内层的作用域找不到i的时候,会向上继续找,直到找到为止
    }
    i++
    if ( ! i < 6 ) return // 循环退出的条件
}

同样的另外一个例子

for (var i = 0; i<6; i++){
    var i = 'ace';
    console.log(i); // ace
}
console.log(i) // NaN 因为在执行i++的时候i变成了字符串,所以会是NaN,并且不符合继续循环的判断条件

deadlyAce
79 声望3 粉丝

前端开发 44