面向对象--类式继承

类式继承:利用构造函数(类)继承的方式

类 : JS是没有类的概念的 , 把JS中的构造函数看做的类
举例

function Aaa(){   //父类
    this.name = '小明';
}
Aaa.prototype.showName = function(){
    alert( this.name );
};

function Bbb(){   //子类  
}
Bbb.prototype = new Aaa();//这个就叫做类式继承

var b1=new Bbb();
b1.showName();//小明
alert(b1.name);//小明(也是一层层查找)

下面图很清楚的表示了上面的关系
这里写图片描述

问题一:但是上面的继承是有问题,不信的话我们做一个实验。继续在上面代码的基础上添加代码

alert( b1.constructor );

弹出

function Aaa(){   //父类
    this.name = '小明';
}

所以应该加上一句话,修正指向问题

Bbb.prototype = new Aaa();//这个就叫做类式继承
Bbb.prototype constructor=Bbb;//修正指向问题

问题二:把上面的代码稍作修改

function Aaa(){   //父类
    this.name = [1,2,3];
}   
Aaa.prototype.showName = function(){
    alert( this.name );
};
function Bbb(){   //子类  
}

Bbb.prototype = new Aaa();
Bbb.prototype.constructor = Bbb; //修正指向问题

var b1 = new Bbb();
b1.name.push(4);

var b2 = new Bbb();
alert( b2.name );//[1,2,3,4]

分析,b1,b2是不同的对象,但是上面互相影响了,所以是有问题的。因为两个找到的都是new Aaa()下面的name,是一个东西,所以会互相影响。
可以这样改正,如下所示

function Aaa(){   //父类
    this.name = [1,2,3];
}   
Aaa.prototype.showName = function(){
    alert( this.name );
};
function Bbb(){   //子类  
    Aaa.call(this);//①此处实现了传递属性
}

var F = function(){};
F.prototype = Aaa.prototype;
Bbb.prototype = new F();//从下面的图可以看出,此处只能传递方法,没有办法传递属性

Bbb.prototype.constructor = Bbb; //修正指向问题

var b1 = new Bbb();
b1.name.push(4);

var b2 = new Bbb();
alert( b2.name );//[1,2,3,4]

这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值