javascript关于继承解析


Posted in Javascript onMay 10, 2016

上一篇已介绍了组合继承,现在讲讲剩余的几种继承。

原型式继承

调用一个函数,接收这个函数返回来的对象,这个对象的原型就是传入函数的参数对象。

如:

function  personObject(o){
    function F(){}
    F.prototype = o;
    return new F();
}
var person = {
   name:"Nicholas",
   friends:["Shelby","Court","Van"]
}

var person_one = personObject(person);

从上面的代码中,我们知道person是person_one的原型。ES5中添加了一个方法规范化原型式继承,这个方法是Object.create(),这个方法有两个参数,第一个是作为新对象原型的对象,像上面的person,第二个是为新对象定义额外属性的对象。第二个参数可选。

如:

var person_one = Object.create(person, {
        name: {
            value:"Jon"
      }
});

当你只想让一个对象与另一个对象保持类似时,可以使用原型式继承。

寄生式继承   

在一个函数里实现一次原型式继承,然后为接收到的这个对象添加自己的属性与方法。

如:

function createAnother(o){
   var person_one = personObject(o);
   person_one.sayHi = function(){
       alert(" hi ");
   }
   return person_one;
}

寄生组合式继承

组合继承也有其缺点,它实现了两次属性继承,而寄生组合式继承就避免了这个问题。实例通过构造函数继承了属性,而原型的方法则是通过寄生式继承的方式来继承。

如:

function inherit(subType, superType){
   var prototype = Object(superType.prototype);
   prototype.constructor = subType;
   subType.prototype = prototype;
}

通过调用上面的函数,实现subTye.prototype的原型是superType.prototype,完成了原型方法的继承。

以上这篇javascript关于继承解析就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery之end()和pushStack()使用介绍
Feb 07 Javascript
JavaScript高级程序设计(第3版)学习笔记5 js语句
Oct 11 Javascript
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
JS如何将数字类型转化为没3个一个逗号的金钱格式
Jan 27 Javascript
通过JS来动态的修改url,实现对url的增删查改
Sep 01 Javascript
JavaScript设计模式之工厂方法模式介绍
Dec 28 Javascript
js给selected添加options的方法
May 06 Javascript
最细致的vue.js基础语法 值得收藏!
Nov 03 Javascript
详解react native页面间传递数据的几种方式
Nov 07 Javascript
node 标准输入流和输出流代码实例
Sep 19 Javascript
vue实现导航标题栏随页面滚动渐隐渐显效果
Mar 12 Javascript
JavaScript监听一个DOM元素大小变化
Apr 26 Javascript
JavaScript继承学习笔记【新手必看】
May 10 #Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
May 10 #Javascript
深入剖析JavaScript:Object类型
May 10 #Javascript
JavaScript的React Web库的理念剖析及基础上手指南
May 10 #Javascript
快速解决Canvas.toDataURL 图片跨域的问题
May 10 #Javascript
jQuery事件的绑定、触发、及监听方法简单说明
May 10 #Javascript
网页前端登录js按Enter回车键实现登陆的两种方法
May 10 #Javascript
You might like
php后台程序与Javascript的两种交互方式
2009/10/25 PHP
PHP实现对站点内容外部链接的过滤方法
2014/09/10 PHP
Laravel 5.4.36中session没有保存成功问题的解决
2018/02/19 PHP
tp5(thinkPHP5)框架实现多数据库查询的方法
2019/01/10 PHP
php传值和传引用的区别点总结
2019/11/19 PHP
Laravel框架基础语法与知识点整理【模板变量、输出、include引入子视图等】
2019/12/03 PHP
Js如何判断客户端是PC还是手持设备简单分析
2012/11/22 Javascript
JS字符串处理实例代码
2013/08/05 Javascript
replace()方法查找字符使用示例
2013/10/28 Javascript
js 立即调用的函数表达式如何写
2014/01/12 Javascript
jQuery实现自动输入email、时间和域名的方法
2016/08/24 Javascript
删除table表格行的实例讲解
2017/09/21 Javascript
angular2系列之路由转场动画的示例代码
2017/11/09 Javascript
微信小程序之分享页面如何返回首页的示例
2018/03/28 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
2018/08/10 Javascript
layui type2 通过url给iframe子页面传值的例子
2019/09/06 Javascript
Element图表初始大小及窗口自适应实现
2020/07/10 Javascript
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
2020/07/20 Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
2020/09/08 Javascript
[16:14]教你分分钟做大人:米拉娜(HEROS)
2014/11/24 DOTA
Python实现CET查分的方法
2015/03/10 Python
Python教程之全局变量用法
2016/06/27 Python
pytorch 转换矩阵的维数位置方法
2018/12/08 Python
Python面向对象程序设计OOP入门教程【类,实例,继承,重载等】
2019/01/05 Python
详解Python Matplot中文显示完美解决方案
2019/03/07 Python
python selenium爬取斗鱼所有直播房间信息过程详解
2019/08/09 Python
python科学计算之numpy——ufunc函数用法
2019/11/25 Python
详解python破解zip文件密码的方法
2020/01/13 Python
python实现批量命名照片
2020/06/18 Python
HTML5公共页面提取作为公用代码的方法
2020/06/30 HTML / CSS
html5实现输入框fixed定位在屏幕最底部兼容性
2020/07/03 HTML / CSS
华为c/c++笔试题
2016/01/25 面试题
大学生职业生涯规划书的基本内容
2014/01/06 职场文书
化学专业大学生职业生涯规划范文
2014/09/13 职场文书
2015年圣诞节寄语
2015/08/17 职场文书
创业计划书之酒吧
2019/12/02 职场文书