1. 原型式继承方法

js 继承使用不难,要说清楚,需要自己一定总结,才能说清楚。

es5 的继承方式有很多种,这个是 js 语言本身造成,但是类实现继承之后的功能,有如下 3 条:

  1. 子类继承父类,主要继承父类的原型上的属性和方法,和可以自定义子类继承父类的构造函数里的属性和方法
  2. 重写子类原型的属性和方法时,父类的原型的属性和方法不会更改
  3. 子类没有重写继承父类属性和方法,父类重写子类继承父类的属性和方法时,子类的原型上的属性和方法也会跟着重写

es5 继承最主要的原型式继承方法,这个函数步骤分为 4 步骤:

  1. 创建一个中间的构造函数Fn,Fn.prototype = Super.prototype
  2. 实例化 Fn 为 var fn = new Fn(),将 Child.prototype = fn
  3. Child.prototype.constructor = Child
  4. Child 构造函数中封装一个 super 方法,来继承父类里的构造函数。

ps:当然步骤 1 和 2 可用 Object.create() 来替代。

代码如下:

function extends (Sup, Sub) {
// var Fn = function () {}
// Fn.prototype = Sup.prototype
// var fn = new Fn()
// Sub.prototype = fn
Sub.prototype = Object.cteate(Sup.prototpye)
Sub.prototype.constructor = Sub
} function super (Sup) {
var args = []
if (arguments.length > 1) {
args = Array.protoype.slice.call(arguments, 1)
}
Sup.apply(this, args)
}
function Sup (name) {
this.name = name
}
function Sub (name) {
super(Sup, name)
} extends(Sup, Sub)

内存分析:

2. 其他继承方式

明白上面一种方式,其他几种方法,就很容易理解。

借用构造函数

子类只继父类构造函数里的属性,不继承原型

组合继承

子类原型上继承父类所有定义属性,如果子类可以自定义继承构造函数里的属性

其他,略

es5原型式继承间解的更多相关文章

  1. javascript中类式继承和原型式继承的实现方法和区别

    在所有面向对象的编程中,继承是一个重要的话题.一般说来,在设计类的时候,我们希望能减少重复性的代码,并且尽量弱化对象间的耦合(让一个类继承另一个类可能会导致二者产生强耦合).关于“解耦”是程序设计中另 ...

  2. [js高手之路]原型式继承与寄生式继承

    一.原型式继承本质其实就是个浅拷贝,以一个对象为模板复制出新的对象 function object( o ){ var G = function(){}; G.prototype = o; retur ...

  3. 理解JavaScript原型式继承

    0.基础 javascript没有类的概念, javascript不需要实例化某个具体类的实例.javascript对象本身可以用来创建对象, 而对象可以继承自其他对象, 这个概念称为原型式继承 每个 ...

  4. JavaScript中的类式继承和原型式继承

    最近在看<JavaScript设计模式>这本书,虽然内容比较晦涩,但是细品才发现此书内容的强大.刚看完第四章--继承,来做下笔记. 书中介绍了三种继承方式,类式继承.原型式继承和掺元类继承 ...

  5. JavaScript ----------------- 原型式继承

    思想:借助原型可以基于已有的对象创建新对象,同时还不必因此创建自定义类型.为了达到这个目的,看看下面的实现方式 function object(o){ function F(){ } F.protot ...

  6. JavaScript之面向对象学九(原型式继承和寄生式继承)

    一.原型式继承 该继承模式是由道格拉斯*克罗克福德在2006年提出的实现继承的方法. 模式的基本思路:借助原型可以基于已有的对象创建新的对象,同时还不必因此创建自定义类型. 代码如下: functio ...

  7. JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

    说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象J ...

  8. js原生继承之——原型式继承实例

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  9. Javascript继承4:洁净的继承者----原型式继承

    //原型式继承 function inheritObj(obj){ //声明一个过渡函数对象 function F(){} //过渡对象的原型继承父对象 F.prototype = obj; //返回 ...

随机推荐

  1. Flask开发微电影网站(四)

    会员中心页面,如下图所示 用户登录后,修改密码页面,如下图所示 用户查看自己的评论页面,如下图所示 用户查看自己的登录日志页面,如下图所示 用户查看自己收藏的电影的页面,如下图所示 1. 定义用户主页 ...

  2. php获取两个时间戳之间相隔多少天多少小时多少分多少秒

    /** * 返回两个时间的相距时间,*年*月*日*时*分*秒 * @param int $one_time 时间一 * @param int $two_time 时间二 * @param int $r ...

  3. Eigen::Matrix与array数据转换

    1. 数组转化为Eigen::Matrix ]; cout << "colMajor matrix = \n" << Map<Matrix3i> ...

  4. min-max容斥 hdu 4336 && [BZOJ4036] 按位或

    题解: 之前听说过这个东西但没有学 令$max(S)$表示S中编号最大的元素,$min(S)$表示编号中最小的元素 $$max(S)=\sum{T \in S} {(-1)}^{|T|+1} min( ...

  5. 洛古P1036 选数 题解

    [我是传送门] 这是一道很经典的深搜与回溯(难度一般) 可是就这个"普及-" 让本蒟蒻做了一晚上+半个上午(实际我不会深搜回溯,全靠框架+去重); 下面让我分享下本蒟蒻的(全排列+ ...

  6. AtCoder Grand Contest 027 (AGC017) D - Modulo Matrix 构造

    原文链接https://www.cnblogs.com/zhouzhendong/p/AGC027C.html 题解 首先我们假装 max mod min = 1 然后对着这个构造. 将各自黑白染色, ...

  7. Kafka生产者发送消息的三种方式

    Kafka是一种分布式的基于发布/订阅的消息系统,它的高吞吐量.灵活的offset是其它消息系统所没有的. Kafka发送消息主要有三种方式: 1.发送并忘记 2.同步发送 3.异步发送+回调函数 下 ...

  8. Laravel 5 中间件、路由群组、子域名路由、 权限控制的基本使用方法

    创建控制器: php artisan make:controller Admin/IndexController 创建Middleware: php artisan make:middleware T ...

  9. python 爬虫与数据可视化--python基础知识

    摘要:偶然机会接触到python语音,感觉语法简单.功能强大,刚好朋友分享了一个网课<python 爬虫与数据可视化>,于是在工作与闲暇时间学习起来,并做如下课程笔记整理,整体大概分为4个 ...

  10. Selenium 2自动化测试实战

    Selenium 2自动化测试实战 百度网盘 链接:https://pan.baidu.com/s/1aiP3d8Y1QlcHD3fAlEj4sg 提取码:jp8e 复制这段内容后打开百度网盘手机Ap ...