ES6声明变量新增的四种方式

在ES6中，除了之前ES5中的var和function两种声明方式之外添加了let、const、class、import四种方式。下面来详细说一下这四种方式！

一.let

1:声明的变量只能在当前作用域下使用
例如：

{
	 let a = 10;
	 var b = 1;
}		
console.log（a） // ReferenceError: a is not defined.
console.log（b ）// 1

在上面代码中，当前的作用域是{}，在外打印a会报错，a未定义。
var声明的变量是可以获取到的，因为var所声明的是一个全局变量。

2:声明的变量不能重复声明
例如:

{
	let a=10;
	let a=11
	console.log(a)		//SyntaxError: redeclaration of let a
	var b=10；
	var b=11；	//这里var声明的不会报错，第二个会覆盖第一个的值
}

3:不存在变量提升，定义之前不可用

	{
		console.log(a)	//ReferenceError: can't access lexical declaration `a' before initialization
		let a=10;			
	}

如果将上面代码let换成var则不会报错，var存在变量提升，在声明之前调用会显示为undefined。

4:let存在暂时性死区

只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。

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

注意：“暂时性死区”也意味着typeof不再是一个百分之百安全的操作。

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

 {
        let a = 1;
        if (true) {
            console.log(a);//报错
            let a;
        }
    }
    {
        function bar(x = y, y = 2) {
            return [x, y];
        }
        bar();//报错
    }
    {
        var a=a;
        let b=b;//报错

二.const
同样拥有let的特性。
另外：
1:声明的是一个常量，声明过后不能被重新赋值。
2:const （只读）（一旦声明必须赋值）

const MAX = 123;

3:对于复合类型变量 (可以给他的属性赋值)

  const a = {};
  a.name = "dai";
  a.age = 21;

4:如果你不想添加属性

  const b = Object.freeze({});
  b.name = 'dai'; 	//TypeError

三.class

1:class作为es6的语法糖，实际上es5也可以实现的。

  class Point {
    constructor (x, y) {
      this.x = x;
      this.y = y;
    }
    toString () {
      return this.x + ',' + this.y;
    }
  }

//上面是一个类

  Object.assign(Point.prototype, {
    getX () {
      return this.x;
    },
    getY () {
      return this.y;
    }
  })
  let p1 = new Point(1,2);
  console.log(p1.toString()); //1,2
  console.log(p1.getX()); //1
  console.log(p1.getY()); //2
  console.log(Object.keys(Point.prototype)); // ["getX", "getY"]  

1:方法之间不需要逗号分隔
2:toString () {} 等价于 toString: function () {}
3:你仍然可以使用Point.prototype
4:你可以用Object.assign()一次性扩展很多方法
5:类内部定义方法多是不可以枚举的
6:constructor(){}是一个默认方法，如果没有添加，会自动添加一个空的。
7:constructor默认返回实例对象（this），完全可以指定返回其他的对象。
8:必须用new调用
9:不存在变量提升
10:当用一个变量去接受class时，可以省略classname
11:es6不提供私有方法。

2:使用extends继承

class ThreeDPoint extends Point {
    constructor (x, y, z) {
      console.log(new.target); //ThreeDPoint
      super(x, y);
      this.z = z;
	}

    toString () {
      return super.toString() + ',' + this.z;
    }

    static getInfo() {
      console.log('static method');
    }

    get z() {
      return 4;
    }
    set z(value) {
      console.log(value);
    }
}
  ThreeDPoint.getInfo(); // "static method"
  let ta = new ThreeDPoint(2,3,4);
  console.log(ta.toString()); //2,3,4
  console.log(ta.z); // 4
  ta.z = 200; // 200
  console.log(Object.getPrototypeOf(ThreeDPoint)); //Point

(1)、constructor中必须调用super,因为子类中没有this,必须从父类中继承。
(2)、子类的__proto__属性总是指向父类
(3)、子类的prototype属性的__proto__总是指向父类的prototype
(4)、Object.getPrototypeOf()获取父类
(5)、super作为方法只能在constructor中
(6)、super作为属性指向父类的prototype.
(7)、在constructor中使用super.x = 2，实际上this.x = 2;但是读取super.x时，又变成了父类.prototype.x。
(8)、原生构造函数是无法继承的。
(9)、get set 方法可以对属性的赋值和读取进行拦截
(10)、静态方法不能被实例继承。通过static声明
(11)、静态属性只能 ThreeDPoint.name = “123” 声明 （与static没什么关系）

四:import
1、ES6引入了自己的模块系统。通过export导出，import导入。
2、与CommonJS不同的是，它是获取模块的引用，到用的时候才会真正的去取值。
3、例如js中:

  let student = [
    {
      name: 'xiaoming',
      age: 21,
    },
    {
      name: 'xiaohong',
      age: 18
    }
  ]
  export default student; // 这种导出方式，你可以在import时指定它的名称。  

4、在app.js中我们就可以这样用:

  import StudentList from './student.js'; //指定名称
  console.log(StudentList[0].name); //xiaoming