欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ES6 变量、常量声明总结

程序员文章站 2022-07-16 21:30:07
...


前言

较之前ES5,新版本在声明上有改变,现根据文档教程,总结下不同之处,时常温习。

 

一、var  对比  let

  1、作用域不同

    let只在命令所在的代码块 {} 里有效

    ES5只有全局作用域和函数作用域,没有块级作用域,带来很多不合理的场景,比如:

    第一种场景,内层变量可能会覆盖外层变量。

    

ES6 变量、常量声明总结
var tmp = new Date();

function f() {
  console.log(tmp);
  if (false) {
    var tmp = 'hello world';
  }
}

f(); // undefined
ES6 变量、常量声明总结

    上面代码的原意是,if代码块的外部使用外层的tmp变量,内部使用内层的tmp变量。但是,函数f执行后,输出结果为undefined,原因在于变量提升,导致内层的tmp变量覆盖了外层的tmp变量。

    第二种场景,用来计数的循环变量泄露为全局变量。

    

ES6 变量、常量声明总结
var s = 'hello';

for (var i = 0; i < s.length; i++) {
  console.log(s[i]);
}

console.log(i); // 5
ES6 变量、常量声明总结
    上面代码中,变量i只用来控制循环,但是循环结束后,它并没有消失,泄露成了全局变量。


   ES6的块级作用域可以多个嵌套,外层作用域无法访问内层作用域,内层作用域可以声明外层作用域的参数。
  
  另外,ES6标准也运行在块级作用域下声明函数,而作用域外不可以引用,函数声明是类似于var还是let,歌浏览器可能有自己的处理方式,
所以暂时不建议在块级作用域下声明函数

  块级作用域是一个语句,里面封装了若干语句,没有返回值,现在有一个提案,使得块级作用域可以变为表达式,也就是说可以返回值,
办法就是在块级作用域之前加上do,使它变为do表达式。

    

  2、let 不存在变量提升

  3、let 存在暂时性死区

    ES6明确规定,如果区块中存在letconst命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。

总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。

    ES6 规定暂时性死区和letconst语句不出现变量提升,主要是为了减少运行时错误,防止在变量声明前就使用这个变量,从而导致意料之外的行为。这样的错误在 ES5 是很常见的,现在有了这种规定,避免此类错误就很容易了。

    总之,暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量。

  4、let 不允许重复声明变量

    注意:不能在函数里重复声明参数,会报错

 

二、const 命令

  ES5没有常量的概念,ES6新增常量

  const 命令声明一个只读的常量,一旦声明,值不可以改变,改变会报错;只声明不赋值也会报错。

  作用域与let 相同,只在所在块级作用域内有效,其他的特性也相同

  本质上,const 实际上保证的并不是变量的值不可以改动,而是变量指向的那个内存地址不可以改动,

  对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。

  但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针,const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。  

 

三、ES6声明变量的6中方式

  (ES5只有 var 和function 函数声明两种方式)

  1、ES6 声明方式有var、 let、const、function、import、class

     inport、class 方式的声明留坑,待填。

 

     欢迎访问个人博客:http://www.cnblogs.com/nana-share/

     欢迎加入  627336556 ,群里很多大声可以共同交流学习前端技术

  以上内容参照阮一峰老师的《ECMAScript 6 入门》,会不定期更新;