您的位置:首页 > Web前端 > JavaScript

javascript继承(一)

2016-06-21 09:24 260 查看
1. 原型链继承  
    (1) 原型链的继承方式
function dad(){

this.property = true;

}

dad.prototype.getDadValue = function(){

return this.property;

};

function son(){

this.subproperty = false;

}

//通过原型链继承

son.prototype = new dad();

var instance = new son();
alert(instance.getDadValue());

以上代码创建里连个类型:dad和son,每一个类型分别有一个属性和方法,他们的主要区别是son继承了dad,该继承是通过创建dad的实例,并将该实例赋值给son.prototye实现的。实现的本质是重写了原型对象。取而代之的是一个新类型的实例。

注意: 此时的instance的constructor指向dad,在继承的时候,son的constructor被重写了。

(2) 原型链继承的两个问题

       a. 引用类型值的原型属性会所有实例所共享,而这也正是为什么要在构造函数中,而不是在原型对象中定义属性的原因。在通过原型来实现继承时,原型实际上会变成另一个类型的实例。于是,原先的实例属性也就顺理成章地变成了现在的原型属性。
function dad(){

this.color = ['red','blue'];

}

function son(){

}

son.prototype = new dad();

var instance1 = new son();

instance1.color.push('black');

alert(instance1.color); // red,blue, black

var instance2 = new son();

alert(instance2.color); //red,blue,black

:我们通过dad创建了一个color属性,该属性包含一个数组(引用类型值)。dad的每个实例中都会有一个color属性。当son通过原型链继承了dad后,son.prototype
就变成了dad的一个实例,因此son也拥有了自己的一个color属性(相当于创建了一个son.prototype.color)。结果son的每个实

数传递函数。

2. 构造函数继承
    (1) 解决上面的引用类型的问题
function dad(){

this.color = ['red','blue'];

}

function son(){

dad.call(this)

}

var instance1 = new son();

instance1.color.push('black');

alert(instance1.color); // red,blue, black

var instance2 = new son();

alert(instance2.color); //red,blue,

通过使用call()方法或者apply也可以,实际上是在son实例的环境下调用了dad的构造函数,这样一来,就会在新son对象上执行dad函数中定义的所有对象的初始代码。结果son的每个实例中就会有自己的color的属性了。

(2)传递参数

function
person( name, age ){

this.name = name;

this.age = age;

this.alertName = function() {

alert(this.name);

};

this.alertAge = function(){

alert(this.age);

}

}

function son(name,age,sex){

person.call(this,name,age);

this.sex = '男';

this.alertSex = function(){

alert(this.sex);

}

}

var instance = new son('行者','24','男');

instance.alertName(); //行者

instance.alertAge(); //24

instance.alertSex(); //男

通过call()
方法son就继承了person类,person.call(this,name,age)的意思是使用person的构造函数(其实本质上就是函数)在this对象下执行那么son就有了person的所有属性和方法,son对象就能直接调用person的方法和属性了。

(3) 借用构造函数的问题
 
  如果仅仅是借用构造函数,那么也将无法避免构造函数模式存在的问题-----方法都在构造函数中定义,因此函数的复用就无从谈起,而且,在父类型的原型中定义的方法,对于子类型而言也是不可见的,结果所有类型都只能所使用构造函数模式,所以,构造函数继承也是很少单独使用的。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  javascript 继承