一起来学ES6之声明变量的var,let和const

江子麟
139 阅读4分钟

“我正在参加「掘金·启航计划」”

ECMAScript 6（简称ES6）是于2015年6月正式发布的JavaScript语言的标准，正式名为ECMAScript 2015（ES2015）。本专栏的文章立志于能让大家更加快速且准确的了解到ES6，并且能够加速的把ES6的知识点融入于实战当中。当然虽然是分享ES6，但是依旧会为大家普及ES6之后的知识。

变量声明

变量声明指的是给变量声明一个类型，或者说声明一个变量，先声明再使用是很多语言的变量使用逻辑，也有一些语言会要求定义变量的类型（强类型语言如JAVA），但是JavaScript是弱类型语言，它只要声明就行了（并不完全正确），并不需要去专门定义它的类型。

注意：JS本身是有类型的，如String,Number...等。

1. VAR

导言：在那个远古的时代，所有的东西都是由var来定义的，这样的弱类型，确实太弱了，会有很多的类型（作用域等）所以ES6推出了新的声明方式。总的来说var它天生反骨，仗着只有它自己就搞一些我们前端程序员不喜欢的事情，所以被天降正义，给加了新玩意导致现在被打入冷宫。

1.1 变量提升！

原则上说，我们要先声明再使用变量，但是var是个坏孩子 使用 var 声明的变量将在任何代码执行前被创建，这被称为变量提升。这些变量的初始值为 undefined。用人话讲就是我可以不去声明它，直接用，js会自动帮我声明帮我编译。

2.2 可以多次声明！

按理说，我们的变量只能声明一次，但是var是个坏孩子，非要搞那么两次三次...

var a = 20;
var a = 30;
console.log(a); // 30

3.3 全局变量

现在var一般用于全局变量的声明。 但是在函数中的var是局部的。

2. LET&CONST

由于let和const在大多数情况是一脉相承的，所以这边就把它俩放在一起来讲

LET&CONST的区别

先讲区别，直观的来讲，就是let可以被改变但是const不能被改变。const一旦被定义了就是常量，是不变的！

但是凡是都有意外，const也是，JS中的对象是可以被改变的。准确的说是对象里的属性是可以被改变的，这里的原理是本质的变量中存的是基本类型还是地址对象。

本质上来说const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。但对于复合类型的数据（主要是对象和数组），变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的（即总是指向另一个固定的地址），至于它指向的数据结构是不是可变的，就完全不能控制了。因此，将一个对象声明为常量必须非常小心。

特性

  • 暂时性死区
  • 无变量提升
  • 块级作用域内生效
  • 不允许重复声明
  • 【const 特有】const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。

凡是都有但是 如果真的想将对象冻结，应该使用Object.freeze方法。

const foo = Object.freeze({});

// 常规模式时，下面一行不起作用；
// 严格模式时，该行会报错
foo.prop = 123;

上面代码中，常量foo指向一个冻结的对象，所以添加新属性不起作用，严格模式时还会报错。

除了将对象本身冻结，对象的属性也应该冻结。下面是一个将对象彻底冻结的函数。

var constantize = (obj) => {
  Object.freeze(obj);
  Object.keys(obj).forEach( (key, i) => {
    if ( typeof obj[key] === 'object' ) {
      constantize( obj[key] );
    }
  });
};

ES6 声明变量的六种方法

ES5 只有两种声明变量的方法：var命令和function命令。ES6 除了添加let和const命令，后面章节还会提到，另外两种声明变量的方法：import命令和class命令。所以，ES6 一共有 6 种声明变量的方法。

avatar
文章
阅读
粉丝