【ES6】—类与继承

一、 定义类

class People {
	constructor (name, age) {
		this.name = name
		this.age = age
	}
	showName () {
		console.log(this.name)
	}
}
let p1  = new People('xiaoxiao', 30)
console.log(p1)
// People {name: 'xiaoxiao', age: 30}

小节：

1. 使用class关键字声明类
2. 使用constructor 构造器声明动态属性
3. 在类的第一层级声明动态方法

二、 继承类的动态属性和方法

class People {
	constructor (name, age) {
		this.name = name
		this.age = age
	}
	showName () {
		console.log(this.name)
	}
}
let p1  = new People('xiaoxiao', 30)
console.log(p1)
// People {name: 'xiaoxiao', age: 30}

class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
let c1 = new Coder('xiaoxiao', 18, '小米')
console.log(c1)
c1.showName()
c1.showCompany()

小节：
继承类的声明： class + 子类名 + extends + 父类名
动态属性接收继承：construtor + super (需要被继承的属性)
动态方法的继承： 根据子类继承父类自动继承
子类调用父类的动态方法: 实例. 方法名

三、顶层属性设置与获取

class People {
	constructor (name, age){
		this.name = name
		this.age = age
		this._sex = -1 // 0 : 男， 1: 女
	}
	get sex () {
		if (this._sex === 0) {
			return '男'
		} else if (this._sex === 1) {
			return '女'
		} else {
			return 'error'
		}
		
	}
	set sex (value) {
		if (value === 0 || value === 1) {
			this._sex = value
		}
	}
}
let p1 = new People ('xiaoxiao', 18)
p1.sex = 1
console.log(p1.sex)

class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
let c1 = new Coder('张三',20, '腾讯')
c1.sex = 0
console.log(c1.sex)

小节：

1. 顶层属性通过 中间值声明变量、设置变量、获取变量来实现
2. 顶层属性和构造函数的属性区别在于，顶层属性可以处理业务逻辑，并在类里面的第一层； 构造函数属性无法处理业务逻辑，并在构造器里面的第一层
3. 顶层属性会自动被子类继承，构造函数的属性，需要手动使用super 关键字接收继承

四、静态方法和静态属性

1.静态方法

class People {
	constuctor (name, age) {
		this.name = name
		this.age = age
	}
	static say () {
		return '你好'
	}
}
let p1 = new People ('xiaoxiao', 18)
console.log(People.say())
// 你好
class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
console.log(Coder.say())
// 你好

小节：
静态方法声明：再类第一个层级使用static关键字声明
静态方法调用：使用类名.方法名 调用
子类自动继承父类的静态方法，使用子类名.方法名调用

2. 静态属性

class People {
	constuctor (name, age) {
		this.name = name
		this.age = age
	}
}
People.count = 1
console.log('父类静态属性', People.count)
class Coder extends People {
	constructor (name, age, company) {
		super(name, age) // 继承属性
		this.company = company // 当前类自有属性
	}
	showCompany () {
		console.log(this.company)
	}
}
console.log('子类继承父类的静态属性', Coder.count)

小节：
静态属性声明：类名.属性名 = 值
静态属性调用: 类名.属性名
子类继承父类: class 子类名 extends 父类名
子类调用继承静态属性: 子类.属性名