美文网首页ES6
ES6学习-var、let、const

ES6学习-var、let、const

作者: YINdevelop | 来源:发表于2018-03-02 11:23 被阅读14次

    拜读了技术胖大神的博客,参考关于es6的内容进行消化总结。http://jspang.com/2017/06/03/es6/
    1.在es5中我们只能使用var来声明变量,由var声明的变量在函数外叫全局变量,在函数内叫局部变量。也就是说es5只有一个函数作用域,和一个全局作用域。这样的缺点是不放在函数里面的变量就成为全局变量,不销毁的前提下,永远存在于内存中,造成内存泄漏。所以自然而然,es6发布了let。

    2.在es5中声明常量的方法比较复杂且不常用,这里就不说了,具体可以搜下Object.defineProperty()。所以自然而然,es6发布了const。

    1.var 和 let

    1、let所声明的变量,只在let命令所在的代码块内{ }有效。

    使用var声明

    var a=2;
    {
       var a=3;
    }
    console.log(a); //3
    

    因为var是全局声明的。所以为3

    对比:使用let局部声明

    var a=2;
    {
       let a=3;
    }
    console.log(a); //2
    
    
    
    var b=null
    {
       let c=3;
    }
    console.log(b); //报错 ,Uncaught ReferenceError: b is not defined
    console.log(c); //报错 ,Uncaught ReferenceError: b is not defined
    

    上面两个例子说明了let是局部变量声明,let声明只在区块内起作用,外部是不可以调用的。

    有些刚接触JavaScript的小伙伴会疑惑了,我感觉let还没有var好用,其实let是防止你的数据污染的,在大型项目中是非常有用处的。现在看一个循环的例子,我们来看一下let的好处。

    使用var声明

    for (var i = 0; i < 5; i++) {
        console.log('循环体中:' + i);
    }
    console.log('循环体外:' + i);  
    
    //结果
    循环体中:0
    循环体中:1
    循环体中:2
    循环体中:3
    循环体中:4
    循环体外:5
    

    上面例子,i循环完后,最后变为10仍存在于内存中。一般循环体中,我们只是需要循环变量在循环体内。并不想让其成为全局的。

    对比:使用let声明

    for(let i=0;i<5;i++){
    console.log('循环体中:'+i);
    }
    console.log('循环体外:'+i);
    
    //结果
    循环体中:0
    循环体中:1
    循环体中:2
    循环体中:3
    循环体中:4
    报错 ,Uncaught ReferenceError: i is not defined
    

    从这可以明白let在防止程序数据污染上还是很有用处的。我们要努力去习惯用let声明,减少var声明去污染全局空间。

    2.不存在变量提升

    var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined。这种现象多多少少是有些奇怪的,按照一般的逻辑,变量应该在声明语句之后才可以使用。
    为了纠正这种现象,let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。

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

    3.let不允许在相同作用域内,重复声明同一个变量。

    {
      let a = 10;
      var a = 1; //报错 Uncaught SyntaxError: Identifier 'a' has already been declared
    }
    
    {
      var a = 1;
      let a = 10; //报错 Uncaught SyntaxError: Identifier 'a' has already been declared
    }
    
    {
      let a = 10;
       a = 1;
       console.log(a) //1
    }
    

    2.const(常数,不变的)声明常量

    什么叫常量,通常不会改变的量叫做常量。在程序开发中,有些变量是希望声明后,这个变量始终不变,就需要用const进行声明。

    const a="JSPang";
    var a='技术胖';
    console.log(a); //报错,Duplicate declaration "a" 
    即重复声明a
    

    原因就是我们const声明的变量是不可以改变的。举个更浅显的例子:如果把变量比作一个黑板上的字,写完可以擦掉再改。那么常量就是一块墓碑,一次刻印,终身受用。

    相关文章

      网友评论

        本文标题:ES6学习-var、let、const

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