js 创建对象及继承

es5里面的类

主体就是对象与原型链的继承（记录一下）

1. 对象冒充继承；
2. 原型链继承；
3. 原型链+构造函数的组合继承模式
4. 对象冒充+原型链的组合继承模式

1.最简单的类

function Person() {
	// 定义好属性了
     this.name = '张飞'
     this.age = 20
}

 let p = new Person() // 调用类的话必须通过new实例化
 console.log(`姓名：${p.name}，年龄：${p.age}`) // 通过实力换的对象，调用对象的属性了（姓名：张飞，年龄：20）

2.构造函数和原型链里面增加方法

function Person() {
	// 属性
	this.name = '张飞'
	this.age = 20
	// 方法
	this.run  = function() {
		console.log(`${this.name}今年${this.age}岁了`)
	} // 1.可以在构造函数上定义
}
// 注意：在原型链上增加方法和属性（原型链上的属性会被多个实例共享，而构造函数不会）
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`) // 2.也可以在原型链上定义
}
let p = new Person()
p.run() // 调用构造函数上的方法。打印结果（张飞今年20岁了）
p.work() // 调用原型链上的方法。打印结果（今年满20岁的是张飞）

3.类里面的静态方法

function Person() {
	// 属性
	this.name = '张飞'
	this.age = 20
	// 方法
	this.run  = function() { /*实例方法（必须通过new之后才能调用）*/
		console.log(`${this.name}今年${this.age}岁了`)
	} // 1.可以在构造函数上定义
}

Person.getInfo = function() {
	console.log('我是静态方法')
}

// 注意：在原型链上增加方法和属性（原型链上的属性会被多个实例共享，而构造函数不会）
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`) // 2.也可以在原型链上定义（在原型链上添加方法，也可以用他原型上的方法和属性）
}
let p = new Person()
p.run() // 调用构造函数上的方法。打印结果（张飞今年20岁了）
p.work() // 调用原型链上的方法。打印结果（今年满20岁的是张飞）

// 调用静态方法
Person.getInfo() // 打印结果（我是静态方法）

4.es5里面的继承（对象冒充实现继承）

function Person() {
	// 属性
	this.name = '张飞'
	this.age = 20
	// 方法
	this.run  = function() { /*实例方法（必须通过new之后才能调用）*/
		console.log(`${this.name}今年${this.age}岁了`)
	} // 1.可以在构造函数上定义
}

// 注意：在原型链上增加方法和属性（原型链上的属性会被多个实例共享，而构造函数不会）
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`) // 2.也可以在原型链上定义（在原型链上添加方法，也可以用他原型上的方法和属性）
}

// 新增一个Web类 继承Person类 原型链+对象冒充的组合继承模式
function Web() {
	Person.call(this) // 对象冒充实现继承，Web就继承了Person
}
let w = new Web()
/* w里面没有run()方法，但是w里面继承了Person里面有 */
w.run() // 对象冒充可以继承构造函数里面的属性和方法
/* 报错（Uncaught TypeError: w.work is not a function） */
w.work() // 对象冒充可以继承构造函数里面的属性和方法，但是没有继承原型链的属性和方法

5.es5里面的继承 原型链实现继承

function Person() {
	// 属性
	this.name = '张飞'
	this.age = 20
	// 方法
	this.run  = function() { /*实例方法（必须通过new之后才能调用）*/
		console.log(`${this.name}今年${this.age}岁了`)
	} // 1.可以在构造函数上定义
}

// 注意：在原型链上增加方法和属性（原型链上的属性会被多个实例共享，而构造函数不会）
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`) // 2.也可以在原型链上定义（在原型链上添加方法，也可以用他原型上的方法和属性）
}

// 新增一个Web类 继承Person类 原型链+对象冒充的组合继承模式
function Web() {}
Web.prototype = new Person() // 原型链实现继承（让person类的属性和方法都挂载到Web原型链上了，就相当于Web就有了原型链和构造函数的属性及方法）
let w = new Web()
/* 原型链实现继承：可要继承构造函数里面的属性和方法，也可要继承原型链上的属性和方法 */
w.run() // 可以继承构造函数里面的方法
w.work() // 可以继承原型链上的方法

6.原型链实现继承的问题？（能继承构造函数的属性和方法，也能继承原型链的属性和方法，但是，如果遇到参数传递就会有问题）

情况一

function Person(name,age) {
	this.name = name
	this.age = age
	this.run  = function() {
		console.log(`${this.name}今年${this.age}岁了`)
	}
}
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`)
}
let p = new Person('关羽', 22) // 实例化类的时候传入属性
p.run() // 打印结果（关羽今年22岁了）

情况二

function Person(name,age) {
	this.name = name
	this.age = age
	this.run  = function() {
		console.log(`${this.name}今年${this.age}岁了`)
	}
}
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`)
}
function Web(name,age) {
	
}
Web.prototype= new Person()
let w = new Web('刘备', 25) 
/* 原型链继承能够继承父类构造函数里面的属性和方法，已经原型链上的属性和方法 */
w.run() // 打印结果（undefined今年undefined岁了）// 实例化子类的时候没法给父类传参

7.原型链 + 构造函数的组合继承模式

function Person(name,age) {
	this.name = name
	this.age = age
	this.run  = function() {
		console.log(`${this.name}今年${this.age}岁了`)
	}
}
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`)
}
function Web(name,age) {
	Person.call(this,name,age) /* 解决方法：对象冒充继承 实例化子类可以给父类传参  */
}
Web.prototype= new Person()
let w = new Web('刘备', 25) 
/* 原型链继承能够继承父类构造函数里面的属性和方法，已经原型链上的属性和方法 */
w.run() // 打印结果（刘备今年25岁了）
w.work() // 打印结果（今年满25岁的是刘备）

8.原型链 + 对象冒充继承的另一种方式

function Person(name,age) {
	this.name = name
	this.age = age
	this.run  = function() {
		console.log(`${this.name}今年${this.age}岁了`)
	}
}
Person.prototype.sex = '男'
Person.prototype.work = function() {
	console.log(`今年满${this.age}岁的是${this.name}`)
}
function Web(name,age) {
	Person.call(this,name,age) /* 解决方法：对象冒充继承 可以继承构造函数里面的属性和方法 实例化子类可以给父类传参  */
}
// Web.prototype = new Person() // new Person() 和Person.prototype是等效的
Web.prototype = Person.prototype // 其实就是，只需要继承父类原型链就可以了
let w = new Web('刘备', 25) 
/* 原型链继承能够继承父类构造函数里面的属性和方法，已经原型链上的属性和方法 */
w.run() // 打印结果（刘备今年25岁了）
w.work() // 打印结果（今年满25岁的是刘备）

原型对象也是对象，也有prototype属性，即指向原型对象的原型对象，这样就会形成一条原型链
每个实例对象都有__proto__属性，它指向它的构造函数的原型对象
实例对象在访问属性或者方法时，会先在自身找，没有的话就会在原型链上找
每个构造函数都有一个prototype属性，它指向的是它的原型对象