js整理三:关于继承的方法

写一些看到的继承的方法

##3.1简单的继承##

这个是参考了javascript高级程序设计一书上的继承方法,上一段代码如下

function SuperType(){
    this.name ="person";
}
SuperType.prototype.getname = function(){
      console.log(this.name);
};
function Subtype(){
       this.name = "man";
}
Subtype.prototype = new SuperType();
var instance1 = new Subtype();

然后再上一个图
exten1
根据原型链的概念,SubType可以通过原型链去访问在SuperType中的方法getname,这就也差不多实现了继承的思想,最关键就是Subtype.prototype= new SuperType();这句话让Subtype.prototype为一个新建的SuperType对象,换个方式去理解,每次新建一个对象的时候,新的那个对象的proto属性都会指向构造这个对象的那个构造函数的原型,上述代码中,就是Subtype.prototype中的proto由原来指向objec.prototype变成了指向了SuperType.prototype,由此之后变可以通过原型链访问父类的属性。
还有一点需要注意的就是在这里name属性,在父类也有,在子类也有,子类会把父类的name给覆盖掉,对外呈现的就是在实例中的name,上述代码就是man。

##3.2稍微复杂点的继承##
先一个代码的部分

function SuperType(name){
    this.name = name;
    this.colors = ["red","blue","green"];
}
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("niki",29);
instance1.hasOwnProperty("name");//true
instance1.hasOwnProperty("colors");//true
instance1.hasOwnProperty("age");//true
SubType.prototype.hasOwnProperty("name");//true
SubType.prototype.hasOwnProperty("sayAge");//true
SubType.prototype.hasOwnProperty("colors");//true

然后也上一个图片
extend2
这个例子呢,其实继承的方式都是一样的,只不过在定义子类的方法中用到了call的方法,这里就是调用了SuperType的构造方法,还有一点需要注意的是SubType.prototype = new SuperType();会使得SubType.prototype的constructor属性指向父类的构造函数,如果需要让他指向SubType需要对他进行修改

//==貌似在博客上看到过其他的,下次看完了一起补上