js的三种继承方式详解
1.js原型(prototype)实现继承
代码如下
<body> <scripttype="text/javascript"> functionParent(name,age){ this.name=name; this.age=age; this.sayHi=function(){ alert("Hi,mynameis"+this.name+",myageis"+this.age); } } //Child继承Parent functionChild(grade){ this.grade=grade; this.sayGrade=function(){ alert("Mygradeis"+this.grade); } } Child.prototype=newParent("小明","10");/////////// varchi=newChild("5"); chi.sayHi(); chi.sayGrade(); </script> </body>
2.构造函数实现继承
代码如下:
<body> <scripttype="text/javascript"> functionParent(name,age){ this.name=name; this.age=age; this.sayHi=function(){ alert("Hi,mynameis"+this.name+",myageis"+this.age); } } //Child继承Parent functionChild(name,age,grade){ this.grade=grade; this.sayHi=Parent;/////////// this.sayHi(name,age); this.sayGrade=function(){ alert("Mygradeis"+this.grade); } } varchi=newChild("小明","10","5"); chi.sayHi(); chi.sayGrade(); </script> </body>
3.call,apply实现继承 -----很方便!
代码如下:
<body> <scripttype="text/javascript"> functionParent(name,age){ this.name=name; this.age=age; this.sayHi=function(){ alert("Hi,mynameis"+this.name+",myageis"+this.age); } } functionChild(name,age,grade){ this.grade=grade; //Parent.call(this,name,age);/////////// //Parent.apply(this,[name,age]);///////////都可 Parent.apply(this,arguments);/////////// this.sayGrade=function(){ alert("Mygradeis"+this.grade); } //this.sayHi=function(){ //alert("Hi,mynameis"+this.name+",myageis"+this.age+",Mygradeis"+this.grade); //} } varchi=newChild("小明","10","5"); chi.sayHi(); chi.sayGrade(); </script> </body>
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持毛票票!