借用构造函数调用继承
程序员文章站
2022-05-14 09:29:43
...
3.1借用的方式
借用构造函数调用继承,又叫伪装调用继承或冒充调用继承。虽然有了继承两个子,
但是这种方法从本质上并没实现继承,只是完成了构造方法的调用而已。
使用call或apply这两个方法完成函数借调。这两个方法的功能是一样的,只有少许的区别(暂且不管)。
功能都是更改一个构造方法内部的this指向到指定的对象上。
function Father (name,age) {
this.name = name;
this.age = age;
}
//这样直接调用,那么father中的this只的是 window。 因为其实这样调用的: window.father("李四", 20)
// name 和age 属性就添加到了window属性上
Father("李四", 20);
alert("name:" + window.name + "\nage:" + window.age);
//使用call方法调用,则可以改变this的指向
function Son (name, age, sex) {
this.sex = sex;
//调用Father方法(看成普通方法),第一个参数传入一个对象this,则this(Son类型的对象)就成为了Father中的this
Father.call(this, name, age);
}
var son = new Son("张三", 30, "男");
alert("name:" + son.name + "\nage:" + son.age + "\nsex:" + son.sex);
alert(son instanceof Father); //false
函数借调的方式还有别的实现方式,但是原理都是一样的。
但是有一点要记住,
这里其实并没有真的继承,仅仅是调用了Father构造函数而已。也就是说,son对象和Father没有任何的关系。
3.2借用的缺陷
Father的原型对象中的共享属性和方法,Son没有办法获取。因为这个根本就不是真正的继承。
四、组合继承
组合函数利用了原型继承和构造函数借调继承的优点,组合在一起。成为了使用最广泛的一种继承方式。
//定义父类型的构造函数
function Father (name,age) {
// 属性放在构造函数内部
this.name = name;
this.age = age;
// 方法定义在原型中
if((typeof Father.prototype.eat) != "function"){
Father.prototype.eat = function () {
alert(this.name + " 在吃东西");
}
}
}
// 定义子类类型的构造函数
function Son(name, age, sex){
//借调父类型的构造函数,相当于把父类型中的属性添加到了未来的子类型的对象中
Father.call(this, name, age);
this.sex = sex;
}
//修改子类型的原型。这样就可以继承父类型中的方法了。
Son.prototype = new Father( );
var son1 = new Son("志玲", 30, "女");
alert(son1.name);
alert(son1.sex);
alert(son1.age);
son1.eat();
组合继承是我们实际使用中最常用的一种继承方式。
可能有个地方有些人会有疑问:Son.prototype = new Father( );这不照样把父类型的属性给放在子类型的原型中了吗,还是会有共享问题呀。但是不要忘记了,我们在子类型的构造函数中借调了父类型的构造函数,也就是说,子类型的原型中有的属性,都会被子类对象中的属性给覆盖掉。就是这样的。
作者:做人要厚道2013
来源:CSDN
原文:https://blog.csdn.net/u012468376/article/details/53127929
版权声明:本文为博主原创文章,转载请附上博文链接!
下一篇: vue实现5秒后跳转新页面