JS的继承是基于JS类的基础上的一种代码复用机制。换言之,有了代码,我们就不需要复制之前写好的方法,只要通过简捷的方式 复用之前自己写的或同事写的代码。比如一个弹出层,我们需要在上面做一些修改。同事写好了一个,我们继承一下,对它的某个方法做了一些修改,或者新建一个方法,然后 再new出来就可以用。
它可以使用现有类的所有功能,并在无需重新编写原来的类的情况下对这些功能进行扩展。
通过继承创建的新类称为“子类”或“派生类”。
被继承的类称为“基类”、“父类”或“超类”。
在清楚继承的作用之后,下面我们来探讨一下JS中的几种继承实现的方式:
//混入式继承(拷贝)//obj2继承到obj1中的成员,可以直接将obj1中的成员拷贝到obj2中即可var obj1 = {name:"zs",age:10};var obj2 = {};// 将obj1中的成员拷贝到obj2中for (var key in obj1) {
obj2[key] = obj1[key];
}console.log(obj1);console.log(obj2);
最终得到的obj2中的成员和obj1中的成员完全一致,当然,我们需要清除的是,此时的obj1和obj2是两个不同的对象。
混入式继承方式看似很简单,但是存在共享数据安全的问题。
var obj1 = {name:"zs",age:10,car:{name:"mini"}};var obj2 = {};// 将obj1中的成员拷贝到obj2中for (var key in obj1) {
obj2[key] = obj1[key];
}//修改obj1对象中的car属性
obj1.car.name = "bus";
console.log(obj1);console.log(obj2);
当我们需要修改某些对象中的引用类型对象的时候,会造成其他相关的对象也被修改,这是我们不希望看到的。
原型式继承的实现
回想一下,当我们在访问一个对象中的成员的时候,首先是在当前对象中查找,如果找不到,就往上,在原型链中依次查找,如果在整个原型链中也不存在该成员,那么就返回undefined。
所以,我们想要在A对象中访问到B对象中的成员,除了将B中的成员添加到A中,如:混入式,我们也可以考虑将B中成员添加到A的原型链中,实现对象成员的共享。
function Animal() {
}
Animal.prototype.name="animal";function Person() {
}//修改Person的原型对象
Person.prototype= Animal.prototype;
Person.prototype.useTool = function () {
console.log("use fire");
}var p = new Person();console.log(p);var ani = new Animal();console.log(ani);
画图分析:
使用原型链继承方式能够继承到更多的成员。但是依然存在问题:
null
创建一个空对象,这个空对象中连最基本的原型对象都没有的
对象
创建传递进来的对象,并设置该对象的原型对象为当前的参数
该方法的使用率比较低,要求大家知道存在这样的一种创建对象的方式即可。
call方法和apply方法的基本使用
call和apply方法作用:
SubClass.prototype = new SuperClass();//继承原型链上的成员
总结: ECMAScript 实现继承的方式不止一种。这是因为 JavaScript 中的继承机制并不是明确规定的,而是通过模仿实现的。这意味着所有的继承细节并非完全由解释程序处理。作为开发者,你有权决定最适用的继承方式。
绘制完整的原型链结构图
这一节重点探讨函数对象的原型链结构。完整的结构图如下:
继承总结起来就是用构造函数(call ,apply)继承不同的实例属性,通过父对象的原型指向子对象的原型实现相同方法的继承,但是有一点要注意,不能通过 sub.prototype = Super.prototype继承父对象的原型。因为这样,相当于父对象和子对象同时公用一个原型,对子对象做的修改,会影响到父对像,此时父对象的原型链已经被破坏,所以对于这种情况一定要注意!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。