js实现继承

1、
使用call方法继承属性;
使用prototype继承方法;

var Parent=function(name){
        this.name=name || 'parent';
    }
    Parent.prototype.getName=function(){
        return this.name;
    }
    var Child=function(name){
        Parent.apply(this,arguments);//通过apply调用父类的构造函数来进行相同的初始化工作
    }
    Child.prototype=Parent.prototype;

2、这样继承会产生问题,它把父类的原型直接赋值给子类的原型,这就会造成一个问题,就是如果对子类的原型做了修改,那么这个修改同时也会影响到父类的原型,进而影响父类对象,这个肯定不是大家所希望看到的。为了解决这个问题就有了临时构造函数模式。

 var Parent=function(name){
        this.name=name || 'parent';
    }
    Parent.prototype.getName=function(){
        return this.name;
    }
    var Child=function(name){
        Parent.apply(this,arguments);//通过apply调用父类的构造函数来进行相同的初始化工作
    }
    var F=new Function();
    F.prototype=Parent.prototype;
    Child.prototype=new F();
    //通过在父类原型和子类原型之间加入一个临时的构造函数F,切断了子类原型和父类原型之间的联系,这样当子类原型做修改时就不会影响到父类原型。

3、其实可以不使用中间变量F,直接Child.prototype = new Parent();也可以,就是父类构造函数被执行了两次,一次是在子类构造函数中,一次在赋值子类原型时,这是很多余的。

var Parent=function(name){
        this.name=name || 'parent';
    }
    Parent.prototype.getName=function(){
        return this.name;
    }
    var Child=function(name){
        Parent.apply(this,arguments);//通过apply调用父类的构造函数来进行相同的初始化工作,一次调用
    }
    Child.prototype=new Parent();//二次调用父类构造函数
    Child.prototype.sayHi=function(){
        alert('hi');
    }
    var parent=new Parent('myParent');
    var child=new Child('myChild');
    console.log(parent.getName());
    console.log(child.getName());
    parent.sayHi();//报错。说明子类prototype不会影响父类
    

4、采用逐个赋值的方式

    var Parent=function(name){
        this.name=name || 'parent';
    }
    Parent.prototype.getName=function(){
        return this.name;
    }
    var Child=function(name){
        Parent.apply(this,arguments);//通过apply调用父类的构造函数来进行相同的初始化工作,一次调用
    }
   for(var k in Parent.prototype){
        Child.prototype[k]=Parent.prototype[k];
   }
    Child.prototype.sayHi=function(){
        alert('hi');
    }
    var parent=new Parent('myParent');
    var child=new Child('myChild');
    console.log(parent.getName());
    console.log(child.getName());
    parent.sayHi();//报错。说明子类prototype不会影响父类

参考博文:http://www.cnblogs.com/haoyijing/p/5760586.htm

你可能感兴趣的:(js实现继承)