学习JavaScript(5)继承


前言

学习JavaScript(1)关于对象

学习JavaScript(3)创建类

参考红宝书JavaScript高级程序设计第三版第六章

OO语言都支持两张继承方式:接口继承和实现继。接口继承只继承方法签名,而实现继承则继承实际的方法。由于函数没有签名,ECMAscript只能支持实现继承,而且其实现继承主要是依靠原型链来实现


一、原型链

1、原型链使用

基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。

回顾:构造函数和原型的实例关系是:每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针

原型链:我们让原型对象等于另一个类型的实例,那么此时原型对象将包含一个指向另一个原型的指针,另一个原型中也包含着一个指向另一个构造函数的指针。

假如另一个原型又是另一个类型的实例,那么上述关系依然成立,如此层层递进就构成了实例与原型的链条。

function Parent(){
    this.say = true;
}
Parent.prototype.Parentsay = function(){
    return this.say;
}

function Children(){
}
//继承了 Parent
Children.prototype = new Parent();


let son= new Children();
console.log(son.Parentsay ());

2、原型链问题

主要的问题来自包含引用类型值的原型

在通过原型来实现继承时,原型实际上会变成另一个类型的实例。于是,原先的实例属性也就顺理成章地变成了现在地原型属性了

function Parent(){
    this.character = ["clever"];
}

function Children(){
}
//继承了 Parent
Children.prototype = new Parent();


let son= new Children();
son.character.push("hanson");
console.log(son.character);
//["clever","hanson"]

let daughter= new Children();
console.log(daughter.character);
//["clever","hanson"]

在上面的例子中,帅气特征给了儿子,然而我们重新创建女儿时,发现帅气的特征也加上了,这显然不是我们想看见的

在例子中我们Parent构造函数定义了一个character属性,该属性包含一个数组(引用类型值)。而包含引用类型值得原型属性会被所有实例共享

在通过原型来实现继承时,原型实际上会变成另一个类型的实例。于是,原先的实例属性也就顺理成章地变成了现在的原型属性了

二、借用构造函数

在子类型构造函数的内部调用超类型构造函数

通过使用call()方法也可以在新创建的对象上执行构造函数

function Parent(){
    this.character = ["clever"];
}

function Children(){
//继承了 Parent
    Parent.call(this);
}


let son= new Children();
son.character.push("hanson");
console.log(son.character);
//["clever","hanson"]


let daughter= new Children();
console.log(daughter.character);
//["clever"]

然而借用构造函数也是存在问题的。方法都在构造函数中定义,那么函数就无法复用。而且,在超类型的原型中定义的方法,对子类型而言也是不可见的,结果所有类型都只能使用构造函数模式

三、组合继承(常用)

组合继承,也叫做伪经典继承

使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承

function Parent(name){
    this.name = name;
    this.character = ["clever"];
}

Parent.prototype.sayname = function(){
    return "I am "+ this.name;
}

function Children(name,age){
//继承了 Parent属性
    Parent.call(this,name);
//可以添加子类属性
    this.age = age;
}

Children.prototype = new Parent();
//继承了 Parent方法


let son= new Children("boy",12);
son.character.push("hanson");
console.log(son.sayname());
//I am boy         
console.log(son.character);
//["clever","hanson"]


let daughter= new Children("girl",22);
console.log(daughter.sayname());
//I am girl
console.log(daughter.character);
//["clever"]

总结

个人学习笔记,每天进步多一点

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值