【ES5】—ES5中类与继承

一、如何定义类

1. 类的首字母要大写，用于识别出与普通函数的不同

// 类  构造函数
function People () {
	this.name = 'xiaoxiao'
	this.age = 18
}
// 实例化对象
let p1 = new People()

二、动态属性和方法

1. 动态属性再构造函数里面定义

// 类
function People (name, age) {
	console.log(this)
	this.name = name
	this.age = age
}
// 实例化对象
let p1 = new People('xiaoxiao', 18)
let p2 = new People('xiaoming', 20)
console.log(p1, p2)
// People {name: 'xiaoxiao', age: 18} People {name: 'xiaoming', age: 20}

PS：构造函数的this指向是实例化出来的对象

2.动态方法在原型上定义

PS：因为把方法放在构造函数中，每次声明一个实例化对象，就会生成一个方法，这样会造成资源的浪费

// 类
function People (name, age) {
	console.log(this)
	this.name = name
	this.age = age
}
People.prototype.ShowName = function () {
	console.log('我的名字是' + this.name)
}
// 实例化对象
let p1 = new People('xiaoxiao', 18)
let p2 = new People('xiaoming', 20)
p1.ShowName()
p2.ShowName()
// 我的名字是xiaoxiao
// 我的名字是xiaoming

三、静态属性和方法

// 类
function People (name, age) {
	this.name = name
	this.age = age
	People.count++
}
// 静态属性, 定义再类上
People.count = 0
// 静态方法
People.getCount = function () {
	console.log(this)
	console.log('当前共有' + People.count + '人')
}

People.prototype.ShowName = function () {
	console.log('我的名字是' + this.name)
}
// 实例化对象
let p1 = new People('xiaoxiao', 18)
let p2 = new People('xiaoming', 20)
People.getCount()
/*
ƒ People (name, age) {
	console.log(this)
	this.name = name
	this.age = age
	People.count++
}
*/

PS: 静态方法中this，指向的是构造函数本身

四、组合继承

1. 构造函数实现继承

// 父类
function Animal (name) {
	this.name = name
}
// 动态方法
Animal.prototype.say = function () {
	console.log('你的名字是' + this.name)
}
// 子类
function Dog (name, color) {
	// 把当前Dog构造函数中this指向传递给Animal构造函数中
	// 把name参数传递过去
	Animal.call(this, name) // 继承Animal的属性
	this.color = color
}
let dog = new Dog('金毛', 'red')
console.log(dog.name)
// 金毛
console.log(dog.say())
// dog.say is not a function

缺点：只能继承父类的属性，无法继承父类的方法

2. 原型继承

function Animal (name) {
	this.name = name
}
// 动态方法
Animal.prototype.say = function () {
	console.log('你的名字是' + this.name)
}
// 子类
function Dog (name, color) {
	// 把当前Dog构造函数中this指向传递给Animal构造函数中
	// 把name参数传递过去
	Animal.call(this, name) // 继承Animal的属性
	this.color = color
}
// 原型继承
Dog.prototype = new Animal()
Dog.prototype.constuctor = Dog

let dog = new Dog('金毛', 'red')
console.log(dog.name)
// 金毛
console.log(dog.say())