文档章节

es5 的类继承

itwriter
 itwriter
发布于 2016/11/28 17:13
字数 179
阅读 70
收藏 0
function Shape(x){
 this.x = x;
}
Shape.prototype.show = function(){ console.log("Father X:",this.x || "")};

function Rectangle(x){
 Shape.call(this,x); // 类似面向对象语言的super()方法,可传多个参数
}
Rectangle.prototype = Object.create(Shape.prototype); // 作用类似于面向对象的extends关键字
Rectangle.prototype.show = function(){ console.log("Son X:",this.x || "")};// 复写父类方法
new Rectangle(12).show();

网上关于es5类继承的资料,原理倒是洋洋洒洒的一大堆,还给了各种继承写法,但demo跑起来多数有点问题。

综合各篇文章和官方资料,现在这个写法应该足够简单(重要的只有那三行注释代码),也提到了如何传参和复写,放到chrome控制台里就能跑起来。

参考:

Object.create()

Function.prototype.call(this)

© 著作权归作者所有

共有 人打赏支持
itwriter
粉丝 11
博文 116
码字总数 23658
作品 0
海淀
程序员
ES5和ES6中的继承 图解

Javascript中的继承一直是个比较麻烦的问题,prototype、constructor、proto在构造函数,实例和原型之间有的 复杂的关系,不仔细捋下很难记得牢固。ES6中又新增了class和extends,和ES5搅在一...

钱天兵
2016/06/21
0
0
ES6中的类继承和ES5中的继承模式详解

1、ES5中的继承模式 我们先看ES5中的继承。 既然要实现继承,首先我们得要有一个父类。 Animal.prototype.eat = function(food) { }function Animal(name) { } 1.1、原型链继承 原型链继承核...

余大彬
08/13
0
0
ES5和ES6中的继承

ES5 ES5中的继承,看图: ES5中这种最简单的继承,实质上就是将子类的原型设置为父类的实例。 ES6 ES6中的继承,看图: 所以 ES6和ES5的继承是一模一样的,只是多了class 和extends ,ES6的子...

WolfX
2016/06/03
52
0
es6基本语法

ES6是javascript的下一个版本,也叫做ECMAScript 2015,相对于es5,es6添加了许多新的特性,语言语法更加规范了,es6的出现使javascript步入了编程语言的正规军行列里,很多公司都逐渐使用es6...

马大哈tt
2017/12/23
0
0
ES6的学习(一)

箭头函数 与函数表达式相比,箭头函数有更短的语法。

黑天很黑
2017/02/20
0
0

没有更多内容

加载失败,请刷新页面

加载更多

20180920 rzsz传输文件、用户和用户组相关配置文件与管理

利用rz、sz实现Linux与Windows互传文件 [root@centos01 ~]# yum install -y lrzsz # 安装工具sz test.txt # 弹出对话框,传递到选择的路径下rz # 回车后,会从对话框中选择对应的文件传递...

野雪球
今天
2
0
OSChina 周四乱弹 —— 毒蛇当辣条

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @ 达尔文:分享花澤香菜/前野智昭/小野大輔/井上喜久子的单曲《ミッション! 健?康?第?イチ》 《ミッション! 健?康?第?イチ》- 花澤香菜/前野智...

小小编辑
今天
7
3
java -jar运行内存设置

java -Xms64m #JVM启动时的初始堆大小 -Xmx128m #最大堆大小 -Xmn64m #年轻代的大小,其余的空间是老年代 -XX:MaxMetaspaceSize=128m # -XX:CompressedClassSpaceSize=6...

李玉长
今天
4
0
Spring | 手把手教你SSM最优雅的整合方式

HEY 本节主要内容为:基于Spring从0到1搭建一个web工程,适合初学者,Java初级开发者。欢迎与我交流。 MODULE 新建一个Maven工程。 不论你是什么工具,选这个就可以了,然后next,直至finis...

冯文议
今天
2
0
RxJS的另外四种实现方式(四)——性能最高的库(续)

接上一篇RxJS的另外四种实现方式(三)——性能最高的库 上一篇文章我展示了这个最高性能库的实现方法。下面我介绍一下这个性能提升的秘密。 首先,为了弄清楚Most库究竟为何如此快,我必须借...

一个灰
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部