【ES6】第三节：ES6中另一个不得不说的关键字const

转自：微信公众号—— web前端教程

 

上一节讲了let关键字，它是用来声明一个变量，只在块级作用域起作用。这一节我们来学习ES6新增的另一个关键字const。

 

const 的作用

        const是constant（常量）的缩写，const和 let一样，也是用来声明变量的，但是const是专门用于声明一个常量的，顾名思义，常量的值是不可改变的。以前用var声明的变量，想怎么改就怎么改，同一个变量，后面的值可以轻松覆盖原来的值，这次const声明的变量，可由不得我们这么任性地想改就改了。

 

常量的特点

1、不可修改

    const Name = '张三';
    Name = '李四';//错误，企图修改常量Name

2、只在块级作用域起作用，这点与let关键字一样。

 
    if(1){
       const Name = '张三';
     }
    alert(Name);//错误，在代码块{ }外，Name失效

3、不存在变量提升，必须先声明后使用，这点也跟let关键字一样。

   
    if(1){
        alert(Name);//错误，使用前未声明
        const Name = '张三';
    }
  

4、不可重复声明同一个变量，这点跟let也一样。

    var Name  = '张三';
    const  Name = '李四';//错误，声明一个已经存在的变量Name

5、声明后必须要赋值

  
    const NAME; //错误，只声明不赋值

        以上这些小知识点都比较简单，不用举生活上的例子都可以理解，也不难记住。

 

如果常量是一个对象呢？

我们接着看下面这段小代码：

    const Person = {"name":"张三"};
    Person.name = "李四";
    Person.age = 20;
    console.log(Person);
    //结果：正常输出{name: "李四", age: 20}

         咦？怎么常量Person好像被修改了，name改成了“李四”，而且还添加了age属性，值为20；怎么没有报错，还正常输出，不是说好了常量不可修改吗，友谊小船说翻就翻了，说好的常量说变就变，别怕，友谊还是很牢固的。

        我们一起来找找原因。

传址赋值

        这个时候，我们先引入一个概念：在赋值过程中，我们可以分为传值赋值和传址赋值。这里我们用到了传址赋值，什么叫传址赋值？

传址：在赋值过程中，变量实际上存储的是数据的地址（对数据的引用），而不是原始数据或者数据的拷贝。

新手看不懂上面这段话，没关系的，看段代码：

    var student1 = {"name":"张三"};
    var student2 = student1;
    student2.name = "李四";
    console.log(student1);
    //结果：输出 {name: "李四"}
    console.log(student2);
    //结果：输出 {name: "李四"}

        为什么student2的name改成了“李四”，student1的那么也变成了“李四”呢？这就是传址赋值！

        怎么理解传址赋值？就好比，你预约了一个装修工（张师傅）到你家进行装修，你把你家的地址告诉了他，他顺着地址来到你家，按照你的要求，把你家的门弄成红色。

        仅仅过了两天，你觉得不好看，你又找了另一个装修工（王师傅），你也把地址告诉他，王师傅来到后也是按照你的要求，把门弄成了绿色。

 

        最后，不管是张师傅还是王师傅，通过这个地址来到你家的时候，看到的门肯定是绿色的，因为最后一次修改是改成绿色。

 

        看懂这个生活上的的例子，你就看得懂下面这段代码了：

    //张师傅把你家的门改成红色
    var Zhang = {"door":"red"};

    //次日，你把地址也告诉了王师傅
    var Wang = Zhang;

    //王师傅按照地址，去到后把门改成绿色
    Wang.door = "green";

    //最后不管是张师傅还是王师傅来到你家，看到门都是绿色的
    console.log(Wang); //结果：输出 {door: "green"}
    console.log(Zhang); //结果：输出 {door: "green"}

        仔细对比一下，这段代码和上一段小代码的结构一模一样（往上翻一下看看），这就知道为什么student2改了name，student1也被修改了。

        花了不少篇幅来讲传址赋值，希望这个例子能形象地描述出传址赋值，让大家易懂和透彻。

        讲完传址赋值，回到我们的const关键字，用const来声明一个对象类型的常量，就是传址赋值。而不可修改的是对象在内存中的地址，而不是对象本身（不可变的是你家的地址，而不是你家的门）。

        所以，这就很好的解释刚刚的这段代码为什么不会报错，而是正常输出了。

    const Person = {"name":"张三"};
    Person.name = "李四";
    Person.age = 20;
    console.log(Person);
    //结果：正常输出{name: "李四", age: 20}

因为修改的只是Person本身，修改的是name属性和增加一个属性age，而地址没变，也不可变，所以并没有违背常量不可修改的约定。

但是，如果这样写呢，就会报错：

    const Person = {"name":"张三"};
    Person.age = 20;
    Person = {}; 
    //错误，企图给常量Person赋新值（新地址）

        用const声明后，张师傅、王师傅就只认得你家的地址了，不能再告诉他其他家的地址。

 

        const关键字的学习到此就结束了，是不是发现并不难学，大部分特性都跟let的相同，但记住声明一个对象作为常量的时候要小心。此外附带讲解了传址赋值的概念，装修工的例子还算贴切，图文并茂，比较形象地描述传址赋值。

 

本节总结

总结：const也是用于声明一个常量，并必须赋值，声明后不可修改，跟let一样，只在块级作用域起作用，不可重复声明同一个变量，不会变量提升，声明引用类型的常量时，要注意是传址赋值。