ES6:let与const介绍

责编:menVScode 6/8/2017, 5:33:52 PM 阅读(823)

        let命令:用来声明一个变量,和var非常类似。

        const命令:用来声明一个常量,常量就是不可以变化的量。

        用let声明变量的注意事项:

        1、使用let声明的变量,所声明的变量只在命令所在的代码块内有效。代码块就是一对{ }花括号。

{
    let a = 1;
    var b = 2;
    console.log(a);//1
}
console.log(a); //bundle.js:3918 Uncaught ReferenceError: a is not defined

        2、使用let命令声明的变量,在域解析的时候不会被提升。

console.log(a);
var a = 1; //undefined
console.log(b);
let b = 1; //bundle.js:3923 Uncaught ReferenceError: b is not defined
let f = 10;
function fn() {
    f = 7; 
    let f = 2;
}
fn(); // f is not defined

        3、let不允许在同一作用域下声明已经存在的变量。


        let在for循环中的应用

var btns = document.querySelectorAll('button');
for(var i=0; i<btns.length; i++){
    btns[i].onclick = function () {
        console.log(i);
    }
}
//上面代码无论你点击那个按钮,返回的i都是5。

解决方案:

        添加自定义属性

var btns = document.querySelectorAll('button');
for(var i=0; i<btns.length; i++){
    btns[i].index = i;
    btns[i].onclick = function () {
        console.log(this.index);
    }
}

        闭包

var btns = document.querySelectorAll('button');
for(var i=0; i<btns.length; i++){
    (function (i) {
        btns[i].onclick = function () {
            console.log(i);
        }
    })(i)
}

        let声明方式

    for(var i=0; i<btns.length; i++){
    	btns[i].onclick = function () {
        console.log(i);
    }
}

        在循环语句之内是一个父作用域,在循环体之中是一个子作用域。

for(let i=0; i<3; i++){
    let i=10;
    console.log(i); //3次10
}
console.log(i); //bundle.js:3949 Uncaught ReferenceError: i is not defined

        循环体中let i不会受到外面let i=0的影响。


        const介绍

        const命令同样有上面let的1,2,3条特点:所声明的变量只在命令所在的代码块内有效;声明的常量,在域解析的时候不会被提升;不能声明已经被声明过的常量或者变量。

除了这些,还要注意:

        1、声明时必须赋值。

        2、声明的常量存储简单的数据类型时候,不可改变其值;如果存储的是对象,那么引用不可以被改变,至于对象里面的数据如何变化,是没有关系。

const obj = {a:10};
obj.a = 20;
console.log(obj.a); //20
标签: es6 let const
前端交流群: MVC前端网(menvscode.com)-qq交流群:551903636

邮箱快速注册

忘记密码