js的三种继承方式详解
2017-01-21 08:22
726 查看
1.js原型(prototype)实现继承
代码如下
<body> <script type="text/javascript"> function Parent(name,age){ this.name=name; this.age=age; this.sayHi=function(){ alert("Hi, my name is "+this.name+", my age is "+this.age); } } //Child继承Parent function Child(grade){ this.grade=grade; this.sayGrade=function(){ alert("My grade is "+this.grade); } } Child.prototype=new Parent("小明","10");/////////// var chi=new Child("5"); chi.sayHi(); chi.sayGrade(); </script> </body>
2.构造函数实现继承
代码如下:
<body> <script type="text/javascript"> function Parent(name,age){ this.name=name; this.age=age; this.sayHi=function(){ alert("Hi, my name is "+this.name+", my age is "+this.age); } } //Child继承Parent function Child(name,age,grade){ this.grade=grade; this.sayHi=Parent;/////////// this.sayHi(name,age); this.sayGrade=function(){ alert("My grade is "+this.grade); } } var chi=new Child("小明","10","5"); chi.sayHi(); chi.sayGrade(); </script> </body>
3.call , apply实现继承 -----很方便!
代码如下:
<body> <script type="text/javascript"> function Parent(name,age){ this.name=name; this.age=age; this.sayHi=function(){ alert("Hi, my name is "+this.name+", my age is "+this.age); } } function Child(name,age,grade){ this.grade=grade; // Parent.call(this,name,age);/////////// // Parent.apply(this,[name,age]);/////////// 都可 Parent.apply(this,arguments);/////////// this.sayGrade=function(){ alert("My grade is "+this.grade); } // this.sayHi=function(){ // alert("Hi, my name is "+this.name+", my age is "+this.age+",My grade is "+this.grade); // } } var chi=new Child("小明","10","5"); chi.sayHi(); chi.sayGrade(); </script> </body>
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!
您可能感兴趣的文章:
相关文章推荐
- Extjs4.0 最新最全视频教程
- Javascript中toFixed方法的改进
- 5个常见可用性错误和解决方案
- 用户自定义多选框checkbox
- js数组实现图片轮播
- js可突破windows弹退效果代码
- webBrowser执行js的方法,并返回值,c#后台取值的实现
- JSP脚本漏洞面面观
- 使用BAT一句话命令实现快速合并JS、CSS
- js显示当前星期的起止日期的脚本
- 爆炸式的JS圆形浮动菜单特效代码
- 浅谈C#下winform和JS的互相调用和传参(webbrowser)
- js select常用操作控制代码
- JS实现不使用图片仿Windows右键菜单效果代码
- 前端弹出对话框 js实现ajax交互
- 从jsp发送动态图像
- 原生js结合html5制作小飞龙的简易跳球
- js 页面模块自由拖动实例
- js实现小鱼吐泡泡在页面游动特效
- 利用JS实现数字增长