JavaScript中的继续

JavaScript中的继续

以下议论中,我们以Animal作为父类,Cat作为子类,使Cat继续Animal

//父类Animal
function Animal(){
    this.species="动物";
}

//子类Cat
function Cat(name, color){
    this.name=name;
    this.color=color;
}

一、组织函数继续

运用call、apply要领,将父对象的组织函数绑定在子对象上.

代码以下:

function Cat(name, color){
    Animal.call(this, arguments);
    this.name=name;
    this.color=color;
}

二、prototype形式

假如Cat.prototype对象指向一个Animal实例,那末一切的Cat的实例就能够继续Animal了.

代码以下:

/**
*每一个组织函数都有一个原型对象(prototype),这个原型对象是这个函数一切实例的原型(proto).
*每一个原型对象都有一个constructor属性,指向它的组织函数.
*每一个实例也有一个constructor属性,默许挪用prototype的constructor属性.
*/

//将Cat的原型对象设置为Animal的实例
Cat.prototype=new Animal();

//手动改正Cat.prototype.constructor , 假如不改正将指向Animal
Cat.prototype.constructor=Cat;

三、直接继续prototype

因为Animal对象中,稳定的属性都能够直接写入Animal.prototype中,所以我们能够让Cat跳过Animal,直接继续Animal.prototype.

代码以下:

//改写Animal
function Animal(){}
Animal.prototype.species="动物";

//将Cat.prototype指向Animal.prototype,就完成了继续
Cat.prototype=Animal.prototype;

//手动改正constructor指向
Cat.prototype.constructor=Cat;

四、应用空对象作为中介

空对象几乎不占用空间,且这时候修正Catprototype对象,不会影响Animalprototype对象.

代码以下:

var F=function(){};
F.prototype=Animal.prototype;

//将原型实行一个空对象
Cat.prototype=new F();

//照样手动修正constructor的指向
Cat.prototype.constructor=Cat;

能够将上面的要领封装成一个函数

function extend(child, parent){
    var F=function(){};
    F.prototype=parent.prototype;
    child.prototype=new F();
    child.prototype.constructor=child;
}
总结:继续的要领有多种,中心头脑是掌握prototype指向,牢记改正constructor的指向 。
    原文作者:小熊苗苗
    原文地址: https://segmentfault.com/a/1190000009291326
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞