标签:
<!DOCTYPE html> <html> <head> <script type="text/javascript"> //继承第一种方式:对象冒充 //Child对象this,冒充Parent对象的this var Parent=function(username){ this.username=username; this.sayHello=function(){ alert(this.username); } } var Child=function(username,password){ //这三行代码是对象冒充的关键!! this.method=Parent; this.method(username); delete this.method; this.password=password; this.sayWorld=function(){ alert(this.password); } } var parent=new Parent("zhangsan"); var child=new Child("lisi","1234"); //Parent只有一个方法 parent.sayHello(); //Child有两个方法 child.sayHello(); child.sayWorld(); </script> </head> <body> </body> </html>
call方法是定义在Function对象中的方法,所以任意方法都可以调用call。
call方法的第1个参数会被传递给函数中的this,从第2个参数开始,逐一赋值给函数的参数。
<!DOCTYPE html> <html> <head> <script type="text/javascript"> //继承第一种方式:call方法方式 Function对象中的方法 function test(str1,str2){ alert(this.name+" , "+str1+" , "+str2); } var object =new Object(); object.name="zhangsan"; test.call(object,"liujl","1234"); </script> </head> <body> </body> </html>
<!DOCTYPE html> <html> <head> <script type="text/javascript"> //继承第二种方式:使用call方法方式实现对象继承 function Parent(username) { this.username=username; this.sayHello=function(){ alert(this.username); } } function Child(username,password) { Parent.call(this,username);//调用父对象的call方法 //Parent.call(this,new Array(username)); this.password=password; this.sayWorld=function(){ alert(this.password); } } var parent=new Parent("zhangsan"); var child=new Child("lisi","1234"); parent.sayHello(); child.sayHello(); child.sayWorld(); </script> </head> <body> </body> </html>
apply方法也属于 Function对象,所以方法都可以调用apply。
跟call方法唯一不同的是:只采用数组传递参数。而call接收离散参数列表也接收数组。
<!DOCTYPE html> <html> <head> <script type="text/javascript"> //继承第三种方式:使用apply方法方式实现对象继承 function Parent(username) { this.username=username; this.sayHello=function(){ alert(this.username); } } function Child(username,password) { Parent.apply(this,new Array(username));//调用父对象的apply方法 this.password=password; this.sayWorld=function(){ alert(this.password); } } var parent=new Parent("zhangsan"); var child=new Child("lisi","1234"); parent.sayHello(); child.sayHello(); child.sayWorld(); </script> </head> <body> </body> </html>
缺点:无法给构造函数传递参数
<!DOCTYPE html> <html> <head> <script type="text/javascript"> //继承第四种方式:原型链方式(prototype chain) function Parent(){ } Parent.prototype.hello="hello"; Parent.prototype.sayHello=function(){ alert(this.hello); } function Child(){ } Child.prototype=new Parent();//关键
Child.prototype.world="world"; Child.prototype.sayWorld=function(){ alert(this.world); } var child=new Child(); child.sayHello(); child.sayWorld(); </script> </head> <body> </body> </html>
1.父对象 ,将属性定义在构造函数里。
2.父对象 ,方法通过原型的方式定义在构造函数外。
3.子对象,通过call继承属性。
4.子对象,通过将自身的原型指向父对象来进行父对象方法的继承。
<!DOCTYPE html> <html> <head> <script type="text/javascript"> //继承第五种方式:混合方式
//1.父对象 ,将属性定义在构造函数里。 //2.父对象 ,方法通过原型的方式定义在构造函数外。 //3.子对象,通过call方法继承父对象属性。 //4.子对象,通过将自身的原型指向父对象来进行父对象方法的继承。 function Parent(hello){ this.hello=hello; } Parent.prototype.sayHello=function(){ alert(this.hello); } function Child(hello,world){ Parent.call(this,hello); this.world=world; } Child.prototype=new Parent(); Child.prototype.sayWorld=function(){ alert(this.world); } var child=new Child("hello","world"); child.sayHello(); child.sayWorld(); </script> </head> <body> </body> </html>
标签:
原文地址:http://www.cnblogs.com/qq-757617012/p/4194097.html