javascript对象的继承

1. [代码][JavaScript]代码        

01

//1、对象冒充

02	//说明：构造函数使用this关键字给所有属性和方法赋值（即采用类声明的构造函数方式）。因为构造函数只是一个函数，所以可使ClassA的构造函数成为ClassB的方法，然后调用它。ClassB就会收到ClassA的构造函数中定义的属性和方法。

03	function ClassA(sColor) {

04	this.color = sColor;

05	this.showColor = function() {

06	alert(this.color);

07

};

08

}

09

10	function ClassB(sColor, sName) {

11	this.newMethod = ClassA;

12	this.newMethod(sColor);

13	delete this.newMethod;

14

15	this.name = sName;

16	this.showName = function() {

17	alert(this.name);

18

};

19

}

20

21	var oa = new ClassA("RED");

22	var ob = new ClassB("blue", "red");

23	oa.showColor();

24

// RED

25	ob.showColor();

26

// blue

27	ob.showName();

28

// red

2. [代码][JavaScript]代码        

01	//2、call()方法

02	//说明：这是与经典的对象冒充方法最相似的方法。它的第一个参数用作this的对象。其他参数都都直接传递给函数自身。其实就相当于前一个是对象，后一个是普通的参数一样。

03	function showColor(sPrefix, sSuffix) {

04	alert(sPrefix + this.color + sSuffix);

05

};

06	var obj = new Object();

07	obj.color = "red";

08	// the color is red ,a very nice color indeed

09	showColor.call(obj, "the color is ", " ,a very nice color indeed");

10	function ClassA(sColor) {

11	this.color = sColor;

12	this.showColor = function() {

13	alert(this.color);

14

};

15

}

16

17	function ClassB(sColor, sName) {

18	ClassA.call(this, sColor);

19	this.name = sName;

20	this.showName = function() {

21	alert(this.name);

22

};

23

}

24

25	var ob = new ClassB("red", "ooo");

26	ob.showColor();

27

// red

28	ob.showName();

29

// ooo

3. [代码][JavaScript]代码       

01	//3、apply()方法

02	//说明：有两个参数，用作this的对象和要传递给函数的参数的数组。

03	function showColor(sPrefix, sSuffix) {

04	alert(sPrefix + this.color + sSuffix);

05

};

06	var obj = new Object();

07	obj.color = "green";

08	// the color is green ,a very nice color indeed

09	showColor.apply(obj, new Array("the color is ", " ,a very nice color indeed"));

10	function ClassA(sColor) {

11	this.color = sColor;

12	this.showColor = function() {

13	alert(this.color);

14

};

15

}

16

17	function ClassB(sColor, sName) {

18	ClassA.apply(this, arguments);

19	this.name = sName;

20	this.showName = function() {

21	alert(this.name);

22

};

23

}

24

25	var ob = new ClassB("red", "ooo");

26	ob.showColor();

27

// red

28	ob.showName();

29

// ooo

4. [代码][JavaScript]代码        

01

//4、原型链

02	// 说明：原型链扩展了类的原型定义方式。prototype对象是个模板，要实例化的对象都以这个模板为基础。prototype对象的任何属性和方法都被传递给那个类的所有实例。原型链利用这种功能来实现继承机制。原型链的弊端是不支持多重继承。记住，原型链会用另一种类型的对象重写类的prototype属性。因此子类的所有属性和方法必须出现在prototype属性被赋值以后。

03	// 原型链方式对应原型方式

04	function ClassA() {

05

}

06

07	ClassA.prototype.color = "red";

08	ClassA.prototype.showColor = function() {

09	alert(this.color);

10

};

11	function ClassB() {

12

}

13

14	ClassB.prototype = new ClassA();

15	ClassB.prototype.name = "redred";

16	ClassB.prototype.showName = function() {

17	alert(this.name);

18

};

19	var objA = new ClassA();

20	var objB = new ClassB();

21	objA.color = "blue";

22	objA.showColor();

23

// blue

24	objB.color = "green";

25	objB.name = "dodo";

26	objB.showColor();

27

// green

28	objB.showName();

29

// dodo

30	alert( objB instanceof ClassA);

31

// true

32	alert( objB instanceof ClassB);

33

// true

5. [代码][JavaScript]代码        

01

//5、混合方式

02	//说明：与定义类时同样的方式，即利用构造函数方式定义属性，用原型方式定义方法。而在继承机制中，可以用对象冒充继承构造函数的属性，用原型链继承prototype对象的方法。

03	function ClassA(sColor) {

04	this.color = sColor;

05

}

06

07	ClassA.prototype.showColor = function() {

08	alert(this.color);

09

};

10	function ClassB(sColor, sName) {

11	ClassA.call(this, sColor);

12	this.name = sName;

13

}

14

15	ClassB.prototype = new ClassA();

16	ClassB.prototype.showName = function() {

17	alert(this.name);

18

};

19	var objA = new ClassA("BLUE");

20	objA.showColor();

21

// BLUE

22	var objB = new ClassB("red", "baba");

23	objB.showColor();

24

// red

25	objB.showName();

26

// baba