JavaScript如何实现单继承

1.继承的目标

• 儿子要继承爸爸的属性和方法，还要允许儿子修改该属性和方法（可以是公共属性方法，也可以是该儿子特有的新增的），并且不能影响父亲和其他的儿子，

• 父亲一旦新增某个属性OR方法，能同时被儿子继承到（不管是否出生）

2.常见的继承方法

• 类式继承

subclass.prototype = new superclass()

缺点：当子类的实例subclacss instance 去访问superclass上的属性时，由于所有的subclass都是通过.prototype指向了同一个对象，那么 我们修改superclass上的属性时，会影响到所有子类对象。

验证

function superclass(){ this.superValue = ['s','b']}
function subclass(){ this.subvalue = 'sub'}
subclass.prototype = new superclass()

var instance1 = new subclass()
var instance2 = new subclass()

console.log(instance2.superValue)
instance1.superValue.push('c')
console.log(instance2.superValue)
//输出
[ 's', 'b' ]
[ 's', 'b', 'c' ]

2.构造函数继承(假继承)

function subclass(id) {
    superclass.call(this,id)
}
var instance1 = new subclass(10)
instance1.show() //不能调用

subclass根本没有继承父类，只是将子类的实例传递到了父类中，只继承了属性，没有继承方法

3.组合继承

function subclass(id) {
    superclass.call(this,id)
}
subclass.prototype = new superclass()

出生时就将父亲的属性抄到自己身上了，并且不会影响他人，方法与其他儿子是通过原型访问公用的

测试

function superclass(id) {
    this.books = ['javascript','html']
    this.id = id
}
superclass.prototype.show = function () {
    console.log(this.books)
}

function subclass(id) {
    superclass.call(this,id)
}
subclass.prototype = new superclass()

var instance1 = new subclass(10)
var instance2 = new subclass(11)
instance1.books.push('设计模式')
console.log('实例1'+instance1.books)
console.log(instance1.id)
instance1.books.push('asdasd')
console.log('实例2'+instance2.books)
console.log(instance2.id)
instance2.show()

解析：
1.instance1对父类上的某个属性的继承并不是通过原型链的，在instance1出生时，这个属性就被赋值到自身了，所以不会干扰其他实例
2.instance1要调用父类的方法时，通过原型去调用的
缺点：父类中一旦新增了共有属性this.XXX不能被儿子继承，你如果写在了superclass.prototype.xxx = 'xxx'那么又会出现其他对象被影响

• 原型链继承
  与类式继承有一样的问题

function inheritobject(o){
    function F(){}
    F.prototype = o
    return new F()
}

测试代码

function inheritobject(o){
    function F(){}
    F.prototype = o
    return new F()
}
var book = {
    name:'js book',
    alikeBook:["css book","html book"]
}

var newBook = inheritobject(book)
newBook.name = 'ajax book'
newBook.alikeBook.push('xml book')

var otherBook = inheritobject(book)
otherBook.name = 'flash book'
otherBook.alikeBook.push('as book')
console.log(newBook.name)
console.log(newBook.alikeBook)
console.log(otherBook.name)
console.log(otherBook.alikeBook)
console.log(book.name)
console.log(book.alikeBook)

• 寄生式继承

function inheritobject(o){
    function F(){}
    F.prototype = o
    return new F()
}
var book = {
    name:'js book',
    alikeBook:['css book','html book']
}
function createBook(obj) {
    var o = new inheritobject(obj)
    o.getName = function () {
        console.log(this.name)
    }
    return o
}

• 寄生组合继承

function inheritobject(o){
    function F(){}
    F.prototype = o
    return new F()
}
function inheritPrototype(subclass,superclass){
    var p = inheritobject(superclass.prototype)
    p.constructor = subclass
    subclass.prototype =p
}
function superclass(name) {
    this.name = name
    this.color = ['red','blue']
}
superclass.prototype.getName = function () {
    console.log(this.name)
}
function subclass(name,time) {
    superclass.call(this,name)
    this.time = time
}
inheritPrototype(subclass,superclass)
subclass.prototype.getTime = function () {
    console.log(this.time)
}
var instan1 = new subclass('js book','2014')
var instan2 =new subclass('css','2013')
instan1.color.push('black')
console.log(instan2.color)

var book = {
    name:'js book',
    alikeBook:['css book','html book']
}
function createBook(obj) {
    var o = new inheritobject(obj)
    o.getName = function () {
        console.log(this.name)
    }
    return o
}
var newBook = createBook(book)
newBook.getName()