美文网首页JavaScript基础教程
ES6基本的语法(一)let 和 const命令

ES6基本的语法(一)let 和 const命令

作者: StevenTang | 来源:发表于2018-07-31 00:00 被阅读49次

    写在最前面

    2018年7月30日

    开始不定期的更新ES6的语法

    文章的主要思路来自:

    • 渡一课堂的网上视频课
    • 阮老师的ES6标准入门
    • GitHub上的开源内容
    • 以及结合自己的项目经验
    • ...(如果后期再有补充在弥补)
    好了,不在废话直接正题

    ES

    ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Association)通过ECMA-262标准化的脚本程序设计语言。这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,所以它可以理解为是javascript的一个标准,但实际上后两者是ECMA-262标准的实现和扩展。

    ECMAScript 是 JavaScript语言的国际标准,JavaScript 是 ECMAScript的实现

    1.1 let命令

    1.1.1 基本用法

    ES5的时候只有两种作用域一种是函数作用域一种是全局作用域

    比如:

    // 函数作用域
    function fun () {
        var a = 1;
    }
    console.log(a);//报错 ReferenceError: a is not defined
    
    // 全局作用域
    var arr = [];
    for (var i = 0; i < 8; i++){
        arr[i] = function () {
        console.log(i) ;   
        }
    };
    arr[3]();// 打印出来8
    console.log(i);//打印出来8
    

    1.1.2 块级作用域

    ES6 新增了let命令,用于声明变量。用法类似于var,但是所声明的变量只在let命令所在的代码块类有效

    {
        let a = 10;
        var b = 20;
    }
    
    console.log(a);//报错ReferenceError: a is not defined
    console.log(b);// 20
    

    上面的代码在代码块中分别用了let和var声明了两个变量。然后在代码块的外面调用这两个变量然后let声明的变量报错,var声明的变量返货了正确的结果。所以说,let声明的变量值在其所作在的代码块内有效

    for (let i = 0; i < 8; i++){
        ......
    };
    console.log(i);//报错ReferenceError: i is not defined
    
    1.1.3 不存在变量提升

    var命令会有'变量提升'现象,即变量可以在声明之前使用,值为undefined。let命令则没有变量提升否则会报错

    //var 的情况
    console.log(a); // 输出undefined
    var a = 2;
    
    // let 的情况
    console.log(b); // 报错ReferenceError: b is not defined
    let b = 2;
    

    在上面的代码中变量a用var声明会发生变量提升,即在代码执行开始AO/GO就已经存在了,但是值是undefined。变量b用命令let声明就不会发生变量提升,表示在声明它之前变量b是不存在的。所以如果在声明之前用到它,就会抛出一个错误

    1.1.4 暂时性死区

    只要块级作用域内存在let命令,它所声明的变量就是“绑定”这个区域,不在受外部的影响

    var a = 123;
    if (true) {
        a  = 'abc'; //报错ReferenceError
        let a;
    }
    

    在上面的代码中存在一个全局变量a,但是块级作用域内let又声明的一个局部变量a,导致后者会绑定这个块级作用域,所以在let声明变量前,对a赋值会报错

    比较常见的‘死区’

    function a (x = y; y = 1) {
        return[x,y]
    }
    a();//报错
    //因为y在还没有声明之前就赋值给了x
    
    //所以要
    function b (x = 2, y = x){
        return[x,y]
    }
    a();//[2,2]
    
    
    //还有
    
    var c = c;//不报错
    let d = d;//报错ReferenceError: d is not defined
    

    暂时性死区的意思就是,只要进入的当前作用域,所要使用的变量就已经存在,但是不能获取,只有等变量变量的那一行代码出现,才可以使用和过去该变量

    1.1.5 不允许重复声2明

    let 不允许在相同作用域内重复声明同一种变量

    //报错
    function (){
        var a = 1;
        let a = 12;
    }
    
    //报错
    function (b){
        let b
    }
    
    //不报错
    function (c) {
        {
            let c
        }
    }
    

    未完待续.....稍微有点多额

    相关文章

      网友评论

        本文标题:ES6基本的语法(一)let 和 const命令

        本文链接:https://www.haomeiwen.com/subject/kdaqvftx.html