引言
继承是OO语言中一个最为人津津乐道的概念。大部分的OO语言中都支持两种继承方式：接口继承和实现继承。接口继承只继承方法签名，而实现继承则继承实际的方法。在ECMAScript中实现继承的方式主要依靠原型链来实现的。
原型链
基本思想： 利用原型让一个引用类型继承另一个引用类的属性和方法。
function SuperType(){
this.property = true;
}
SuperType.prototype.getSuperValue = function(){
return this.property;
}
function SubType(){
this.subproperty = false;
}
SubType.prototype = new SuperType();
SubType.prototype.getSubValue = function(){
return this.subproperty;
}
var instance = new SubType();
alert(instance.getSuperValue())
如何确定原型和实例的关系？
有两种方式去确定原型和实例之间的关系。
1.使用instanceof操作符。
instanceof 的作用是用来测试实例与原型中出现过的，他的结果会返回
true。接着上面的例子继续
console.log(instance instanceof Object) //true
console.log(instance instanceof SuperType) //true
console.log(instance instanceof SubType) //true
- 使用
isPrototypeof()方法。
只要是原型链中出现过的原型，都可以说是该原型链所派生的实例的原型。也会返回true
console.log(Object.prototype.isPrototypeOf(instance)) //true
console.log(SuperType.prototype.isPrototypeOf(instance)) //true
console.log(SubType.prototype.isPrototypeOf(instance)) //true
原型链的问题
1.包含引用类型值的问题。在通过原型来实现继承是，原型实际上会变成另一个类型的实例，达到共享。
2.没有办法在不影响所有对象实例的情况下，向上给构造函数传递参数。
构造函数继承
为了解决上述原型链问题1，我们可以借用构造函数解决问题并且使用call() 和 applay() 可以在新创建的对象上执行构造函数。
function SuperType(){
this.colors = ['red','green','blue']
}
function Subtype(){
SuperType.call(this)
}
var instance = new Subtype()
instance.colors.push('yellow')
console.log(instance.colors) // ["red", "green", "blue", "yellow"]
var instance2 = new Subtype()
console.log(instance2.colors) // ["red", "green", "blue"]
为了解决上述问题2，如何向上传构造函数传递参数呢?如下：
function SuperType(name) {
this.name = name;
}
function SubType(){
SuperType.call(this,'ymiandi')
this.age = 25
}
var instance = new SubType()
console.log(instance.name) // ymianid
console.log(instance.age) // 25
借用构造函数的问题
使用构造函数存在方法都在构造函数中定义，这样会增加函数复用。
组合继承
function SuperType(name) {
this.name = name
this.colors = ['red','green','blue']
}
SuperType.prototype.sayName = function(){
console.log(this.name)
}
function SubType(name,age){
SuperType.call(this,name)
this.age = age
}
//继承方法
SubType.prototype = new SuperType()
SubType.prototype.constructor = SubType
SubType.prototype.sayAge = function(){
console.log(this.age)
}
var instance1 = new SubType('ershuai',24)
instance1.colors.push('yellow')
console.log(instance1.colors) //["red", "green", "blue", "yellow"]
instance1.sayName()//ershuai
instance1.sayAge() //24
var instance2 = new SubType('ymd',25)
console.log(instance2.colors) //["red", "green", "blue"]
instance2.sayName() // 'ymd
instance2.sayAge() // 25
原型式继承
道格拉斯·克罗克福德采用的一种方法。借助原型可以基于已有的对象创建新对象，同时还不必因此创建自定义类型。给下如下函数：
function object(o){
function F(){}
F.prototype = o
return new F()
}
在object()函数内部，先创建了一个临时性的构造函数，然后西安传入的对象作为这个构造函数的原型，最后返回这个临时类型的一个新实例。从本质上讲，object() 对传入其中的对象执行了一次浅拷贝。
var person = {
name : 'ymiand',
friends: ['qqqq','wwwww','oooo']
}
var anotherPerson = Object.create(person,{
name: {
value: 'Greg'
}
})
var anotherPerson = object(person);
anotherPerson.name = 'Greg'
anotherPerson.friends.push('ttttt')
var yerAnotherPerson = object(person)
yerAnotherPerson.name = 'Linda'
yerAnotherPerson.friends.push('Bar')
console.log(person.friends)
在ECMAScript5 中通过新增Object.create() 方法规范了原型式继承。
var person = {
name : 'ymiand',
friends: ['qqqq','wwwww','oooo']
}
var anotherPerson = Object.create(person,{
name: {
value: 'Greg'
}
})
console.log(anotherPerson.name)
寄生式继承
寄生式继承是与原型式继承紧密相关的一种思路。
寄生式继承的思路与寄生构造函数和工厂模式类似。即创建一个仅用封装继承过程的函数，该函数在内容以某种方式增强对象，最后再返回对象
function createAnother(original){
var clone = object(original);//通过调用函数创建一个新对象
clone.sayHi = function(){//以某种方式来增强这个对象
console.log('hi')
}
return clone//返回这个对象
}
寄生组合式继承
通过借用构造函数来继承属性，通过原型链的混成形式来继承方法。
寄生组合式继承模式基本模式如下：
function inheritPrototype(subType,SuperType){
var prototype = object(SuperType.prototype) //创建对象
prototype.constructor = subType;//增强对象
subType.prototype = prototype;//指定对象
}
ES6 class 继承
class Parent {
constructor(){
this.x = 'aaa'
}
}
class Son extends Parent{
constructor(){
super()
}
}
console.log(new Son())
网友评论