<!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>
使用混合方式实现对象继承。
父对象Shape，让矩形Rectangle继承Shape。
<!DOCTYPE html><html> <head><script type="text/javascript">//父对象--X形function Shape(edge){ this.edge=edge;}//父对象方法--获取面积Shape.prototype.getArea=function(){ return -1;}//子对象---矩形function Rectangle(wide,height){ //继承父对象的属性edge Shape.call(this,4); this.wide=wide; this.height=height;}Rectangle.prototype=new Shape();//继承父对象所有的方法//重写某一个方法---获取矩形面积Rectangle.prototype.getArea=function(){ return this.wide*this.height;}//扩展一个方法Rectangle.prototype.getEdge=function(){ return this.edge;}var rectangle=new Rectangle(3,4);alert(rectangle.getEdge());alert(rectangle.getArea());</script></head> <body></body></html>新闻热点
疑难解答
