es5原型式继承间解
1. 原型式继承方法
js 继承使用不难,要说清楚,需要自己一定总结,才能说清楚。
es5 的继承方式有很多种,这个是 js 语言本身造成,但是类实现继承之后的功能,有如下 3 条:
- 子类继承父类,主要继承父类的原型上的属性和方法,和可以自定义子类继承父类的构造函数里的属性和方法
- 重写子类原型的属性和方法时,父类的原型的属性和方法不会更改
- 子类没有重写继承父类属性和方法,父类重写子类继承父类的属性和方法时,子类的原型上的属性和方法也会跟着重写
es5 继承最主要的原型式继承方法,这个函数步骤分为 4 步骤:
- 创建一个中间的构造函数Fn,
Fn.prototype = Super.prototype。 - 实例化 Fn 为
var fn = new Fn(),将Child.prototype = fn。 - 将
Child.prototype.constructor = Child。 - 在
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原型式继承间解的更多相关文章
- javascript中类式继承和原型式继承的实现方法和区别
在所有面向对象的编程中,继承是一个重要的话题.一般说来,在设计类的时候,我们希望能减少重复性的代码,并且尽量弱化对象间的耦合(让一个类继承另一个类可能会导致二者产生强耦合).关于“解耦”是程序设计中另 ...
- [js高手之路]原型式继承与寄生式继承
一.原型式继承本质其实就是个浅拷贝,以一个对象为模板复制出新的对象 function object( o ){ var G = function(){}; G.prototype = o; retur ...
- 理解JavaScript原型式继承
0.基础 javascript没有类的概念, javascript不需要实例化某个具体类的实例.javascript对象本身可以用来创建对象, 而对象可以继承自其他对象, 这个概念称为原型式继承 每个 ...
- JavaScript中的类式继承和原型式继承
最近在看<JavaScript设计模式>这本书,虽然内容比较晦涩,但是细品才发现此书内容的强大.刚看完第四章--继承,来做下笔记. 书中介绍了三种继承方式,类式继承.原型式继承和掺元类继承 ...
- JavaScript ----------------- 原型式继承
思想:借助原型可以基于已有的对象创建新对象,同时还不必因此创建自定义类型.为了达到这个目的,看看下面的实现方式 function object(o){ function F(){ } F.protot ...
- JavaScript之面向对象学九(原型式继承和寄生式继承)
一.原型式继承 该继承模式是由道格拉斯*克罗克福德在2006年提出的实现继承的方法. 模式的基本思路:借助原型可以基于已有的对象创建新的对象,同时还不必因此创建自定义类型. 代码如下: functio ...
- JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承
说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象J ...
- js原生继承之——原型式继承实例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- Javascript继承4:洁净的继承者----原型式继承
//原型式继承 function inheritObj(obj){ //声明一个过渡函数对象 function F(){} //过渡对象的原型继承父对象 F.prototype = obj; //返回 ...
随机推荐
- eclipse创建maven——初学
1.进入eclipse→File→new→other→搜索maven,如下图: 2.选择一个工作空间,点击Next 3.进入如下页面 4.填写Grop id和Artifact id,Version默认 ...
- leetcode(js)算法10之正则表达式匹配
mmp,对着答案看了三遍才看懂,真是菜的抠脚 给定一个字符串 (s) 和一个字符模式 (p).实现支持 '.' 和 '*' 的正则表达式匹配. '.' 匹配任意单个字符. '*' 匹配零个或多个前面的 ...
- django 第四天
简单的一对多的页面 实现的页面结果如下 利用正则匹配 1.x系列和2.x系列django的用法不同,....他x的. 关于正则匹配 我一直没能实现,再试试吧 路由分发,尤其是在多个页面的时候 app0 ...
- ERROR: invalid byte sequence for encoding "UTF8": 0x00
1.使用kettle批量导入数据的时候,数据出现了下面的错误.ERROR: invalid byte sequence for encoding "UTF8": 0x00 关键点: ...
- 一篇图看清Java中的各种Queue
说到数据结构,我们大概可以列出这么几个:数组,链表,栈,队列,集合,哈希表. 其中 队列 作为一个常用的数据结构,在Java中也有各种形式的实现. 顶级接口为java.util.queue. java ...
- TreeMap 的排序冲突吗
今天在网上看到一个问题:一个已经构建好的 TreeSet,怎么完成倒排序? 网上给出的答案是: 通过TreeSet构造函数传入一个比较器,指定比较器进行排序为原排序的倒叙. TreeSet的自然排序是 ...
- Egret--添加一个精灵事件
class Hello extends egret.DisplayObjectContainer{ //入口函数 private onAddStage(event:egret.Event){ //打开 ...
- Go语言基础(一)
Go语言基础(一) 国庆体验一下大名鼎鼎的Go语言,IDE使用IEDA+Go插件,边敲代码边体会,感觉Go语言好酷 一.Hello World 和Java类似,go文件需要一个package包含,代码 ...
- 手把手教你安装nmon
一.nmon简介 nmon是由IBM 提供.免费监控 AIX 系统与 Linux 系统资源的工具.该工具可帮助在一个屏幕上显示服务器系统资源耗用情况,并动态地对其进行更新.此外,他还可以利用 exce ...
- 重构file_get_contents实现一个带超时POST传值函数
function wp_file_post_contents($url, $post = null) { $context = array(); if (is_array($post)) { ksor ...