zoukankan      html  css  js  c++  java
  • ES6中不得不说的关键字const

    上一节讲了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的那么也变成了“李四”呢?这就是传址赋值!

     

     

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

    img

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

    img

     

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

     

     

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

     

    //张师傅把你家的门改成红色    
    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一样,只在块级作用域起作用,不可重复声明同一个变量,不会变量提升,声明引用类型的常量时,要注意是传址赋值。

    最后我也发布了很多web前端的视频,大家可以去看看

    web前端综合视频

     

     

     

  • 相关阅读:
    HDU 1501 Zipper(DFS)
    HDU 2181 哈密顿绕行世界问题(DFS)
    HDU 1254 推箱子(BFS)
    HDU 1045 Fire Net (DFS)
    HDU 2212 DFS
    HDU 1241Oil Deposits (DFS)
    HDU 1312 Red and Black (DFS)
    HDU 1010 Tempter of the Bone(DFS+奇偶剪枝)
    HDU 1022 Train Problem I(栈)
    HDU 1008 u Calculate e
  • 原文地址:https://www.cnblogs.com/coderhf/p/12782399.html
Copyright © 2011-2022 走看看