es6 class总结

内容概述

• 为什么要有class
• class声明的特点

为什么要有class

js是面向对象编程，可是与其他语言声明类的方式不太一样，es5构造函数的写法，很容易让心学习这门语言的程序员感到困惑，所以es6提供了这种更接近传统语言的写法。
实际上，class的绝大部分功能，es5都可以实现，新的class写法只是让对象原型的写法更清晰。

class声明的特点

1.首先看写法上的对比
es5写法：

function Car() {
  this.wheel = 4;
}
Car.prototype.drove = function () {
  console.log('sou')
}

const smallCar = new Car();

class写法：

class Car {
  //这里的constructor对应es5的构造函数Car
  constructor() {
  //this关键字指向实例对象smallCar
    this.wheel = 4
  }
  //类的所有方法定义在类的prototype属性上
  drove() {
    console.log('sou')
  }
}

const smallCar = new Car();

2.class类不存在变量提升（当使用表达式的时候），原因与继承有关，保证子类在父类之后定义；

//报错
new Car();
class Car {}

3.class类必须用new调用，否则报错；构造函数不用new依然可以当成普通函数调用；
4.class类内部默认使用严格模式；
5.就算在定义类的时候不写constructor方法，也会自动为你加上；

class Car {
  constructor(){}
}
//等同于
class Car {}

6.类中的所有方法都是不可枚举的；
7.静态方法：不能被实例继承的方法；

class Car {
  static di() {
    return 'dididi'
  }
  
  name() {
    return '玄离'
  }
}

const smallCar = new Car();
console.log(smallCar.di()) //报错
console.log(smallCar.name()) //'玄离'

8.静态属性、实例属性

class Car {
  static di = 'dididi'
  name = '玄离'
}

const smallCar = new Car();
console.log(smallCar.di) //undefined
console.log(smallCar.name) //'玄离'

上面的实例属性name用等式写入类的定义中，所以，constructor也可以省了
9.new.target属性返回new命令所作用的构造函数，子类继承父类时，会返回子类；

class Car {
  constructor() {
    console.log(new.target === Car)
  }
}

const smallCar = new Car();  //true

利用这个特性，可以实现让父类只能继承，不能被实例化

class Car {
  constructor() {
    if(new.target === Car) {
       throw new Error('父类不能被实例化')
    }
  }
}

class Children extends Car {
  constructor() {
    super();
    console.log('实例化出来吧')
  }
}

const a = new Car() //报错
const b = new Children() //'实例化出来吧'