之前写过一篇JS中原型与原型链相关：https://www.jianshu.com/p/ec0c063980ee
本文将再深入说明关于JS继承的实现
1. 使用 prototype 的继承
function Human(name){
this.name = name
}
Human.prototype.run = function(){
console.log('我叫'+this.name+'，我在跑')
return undefined
}
function Man(name){
Human.call(this,name)
this.gender = 'Male'
}
Man.prototype.__proto__ = Human.prototype
//以上这句相当于下边的三句，上句在IE不可用，其他时候也尽量不使用
var f = function(){}
f.prototype = Human.prototype
Man.prototype = new f()
Man.prototype.fight = function(){
console.log('打架')
}
2019-10-07_224910.jpg
new在其中做了什么
var obj = new Fn()
- 产生一个空对象
- this = 空对象
- this._proto_ = Fn.prototype
- 执行Fn.call(this,x,y,...)
- return this
2. 使用 ES6 class 语法糖的继承
class Human{
constructor(name){
this.name = name
}
run(){
console.log('我叫'+this.name+'，我在跑')
return undefined
}
}
class Man extends Human{
constructor(name){
super(name)
this.gender = 'male'
}
fight(){
console.log('打架')
}
}
2019-10-07_225554.jpg
与之前的显示有差异，多出了constructor。通过class创建类(实质是函数)，原型链的constructor指向函数本身，所以constructor里写的就是函数体内容。
class语法糖可以很方便的实现继承，但不利于对原型链本身的理解。
