• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > js的三种继承方式详解

js的三种继承方式详解

作者:hahaxiaotianxia 字体:[增加 减小] 来源:互联网 时间:2017-05-11

hahaxiaotianxia通过本文主要向大家介绍了node.js开发实战详解,js prototype详解,js中的this详解,js指标详解附图,js详解等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

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> 
</div>

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> 
</div>

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> 
</div>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • JS触摸事件、手势事件详解
  • 详解Node.js串行化流程控制
  • 详解node.js平台下Express的session与cookie模块包的配置
  • JS条形码(一维码)插件JsBarcode用法详解【编码类型、参数、属性】
  • JS排序之冒泡排序详解
  • JS排序之快速排序详解
  • JS排序之选择排序详解
  • 详解node.js搭建代理服务器请求数据
  • 详解Node.js实现301、302重定向服务
  • js时间查询插件使用详解

相关文章

  • 2017-05-11JavaScript中的this陷阱的最全收集并整理(没有之一)
  • 2017-05-11js 颜色选择插件
  • 2017-05-11浅谈js中function的参数默认值
  • 2017-08-21ES6语法入门-下
  • 2017-05-11JS中input表单隐藏域及其使用方法
  • 2017-05-11JS异步加载的三种实现方式
  • 2017-05-11详解微信小程序 wx.uploadFile 的编码坑
  • 2017-05-11微信小程序组件 contact-button(客服会话按钮)详解及实例代码
  • 2017-05-11bootstrap——bootstrapTable实现隐藏列的示例
  • 2017-05-11js 去掉字符串前后空格实现代码集合

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 详解vue2路由vue-router配置(懒加载)
    • jQuery插件FusionCharts实现的2D面积图效果示例【附demo源码下载】
    • JS在浏览器中解析Base64编码图像
    • 微信小程序中显示html格式内容的方法
    • JS中如何实现Laravel的route函数详解
    • 移动端web滚动分页的实现方法
    • JavaScript实现水平进度条拖拽效果
    • 使用vue.js2.0 + ElementUI开发后台管理系统详细教程(一)
    • 使用vue.js实现checkbox的全选和多个的删除功能
    • 正则验证小数点后面只能有两位数的方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有