在ES6之前创建类的方式与用class创建类的方式的区别：
function Person(name, age) {
this.name = name
this.age = age
}
var person = new Person('张三', 18)
class Person {
// 这是Person的构造器
constructor(name, age) {
this.name = name
this.age = age
}
}
var person = new Person('李四', 20)
每个类中都有一个构造器，如果没有手动指定构造器，那么，可以认为类内部中有一块隐藏的构造器，类似于
constructor(){}，每次执行 new 时，会优先执行构造器中的代码。
实例属性与静态属性
在声明类时，构造函数上传入的属性，称为实例属性。直接挂载到类上的属性，称为静态属性，静态属性无法在实例中调用。ES6 class关键字，静态属性的声明方式：
class Person {
constructor(name, age) {
this.name = name
this.age = age
}
static info = '这是一个静态属性'
}
var person = new Person('张三'， 18)
console.log(person.name) // 张三
console.log(person.info) // undefined
console.log(Person.info) // 这是一个静态属性
实例方法与静态方法
class Person {
constructor(name, age) {
this.name = name
this.age = age
}
// 实例方法
sayHello() {
console.log('Hello, ' + this.name)
}
// 静态方法
static eat() {
console.log('eat')
}
}
var person = new Person('张三', 20)
person.sayHello() // Hello, 张三
person.eat() // undefined
Person.eat() // eat
继承
class通过extends关键字实现继承
语法：class 子类 extends 父类 {}
原代码：
class Chinese {
constructor(name, age) {
this.name = name
this.age = age
}
}
class American {
constructor(name, age) {
this.name = name
this.age = age
}
}
通过extends继承：
// 父类
class Person {
constructor(name, age) {
this.name = name
this.age = age
}
sayHello() {
console.log('Hello, ' + this.name)
}
}
// 子类
class Chinese extends Person {}
class American extends Person {}
var zs = new Chinese('张三', 18)
var jack = new American('jack', 18)
super函数的使用
- 如果一个子类通过
extends关键字继承了父类，那么在子类的constructor中必须优先调用一次super() -
super是一个函数，父类的构造器，子类中调用super，就是对父类构造器的引用。 - 在子类中，
this只能放在super后使用。
示例：
class Person {
constructor(name, age) {
this.name = name
this.age = age
}
}
class Chinese extends Person {
constructor(name, age, idcard) {
super(name, age)
this.idcard = idcard
}
}
注意
- 在
class{ ... }区间内，只能写构造器、静态方法、静态属性、实例方法、实例属性。 -
class关键字内部还是使用原来的方法实现，为JavaScript的语法糖。
