ES6基础语法（一）—— let和const

原创

MarsXHChang 2021-09-09 14:23:26 博主文章分类：es6 ©著作权

文章标签 ES6 let const 作用域 i++ 文章分类 代码人生

©著作权归作者所有：来自51CTO博客作者MarsXHChang的原创作品，请联系作者获取转载授权，否则将追究法律责任

一、let和const

var--声明变量和常量
let--声明变量(不能重复声明)
const--声明常量(不能修改也不能重复声明)
1.let和const的作用域只局限于当前代码块
    {
        var str = '张三';
        let str1 = '李四';
        const str2 = '王五';
    }
    console.log(str); // 张三
    console.log(str1); // not defined
    console.log(str2); // not defined

2.使用let和const声明的变量作用域不会被提升
    {
        console.log(str); // undefined
        var str = '张三';
    //上面相当于下面
        var str;
        console.log(str); // undefined
        str = '张三';
    }

    {
        console.log(str1); // not defined
        let str1 = '李四';
        console.log(str2); // not defined
        let str2 = '王五';
    }

3.let和const在相同的作用域下不能声明相同的变量
    {
        var str = '张三';
        var str = '李四';
        console.log(str); // '李四'

        let str1 = '王五';
        let str1 = '赵六';
        console.log(str1); 
        //Identifier 'str1' has already been declared
        //标识符“str2”已声明
        //const也相同
    }
4.for循环体现let的父子作用域
    //结果始终是第五个按钮(for同步，监听异步)
    var btns = document.querySelectorAll('button');
    for(var i=0; i<btns.length; i++){
        btns[i].onclick = function () {
            alert('点击了第' + i + '个按钮');
        }
    }

    //解决办法(闭包)
    var btns = document.querySelectorAll('button');
    for(var i=0; i<btns.length; i++){
        (function (i) {
            btns[i].onclick = function () {
                alert('点击了第' + i + '个按钮');
            }
        })(i);
    }
    
    //使用let也能达到效果
    let btns = document.querySelectorAll('button');
    for(let i=0; i<btns.length; i++){
        btns[i].onclick = function () {
            alert('点击了第' + i + '个按钮');
        }
    }

5.const申明的常量必须赋值
    {
        const name;
        name = 'zhangsan';
        console.log(name);
        //报错:Missing initializer in const declaration
        //常量声明中缺少初始化
    }
    
    //不能修改
    {
        const name = 'zhangsan';
        name = 'lisi';
        console.log(name);
        //报错:Assignment to constant variable.
        //分配到恒定的变量
    }
    
    //对象在堆中,obj存的是对象的地址
    const obj = {name: '张三'};
    console.log(obj); // {name: '张三'}

    obj.name = '李四';
    console.log(obj); // {name: '李四'}

觉得有帮助的小伙伴右上角点个赞~

ES6基础语法（一）—— let和const_i++