继承之es5对比es6
es5 写法:
function Person(name){
this.name = name;
}
Person.prototype.sayName = function() {
alert(this.name);
}
function VipPerson(name,level){
Person.call(this,name);
this.level = level;
}
// 组合继承(缺点是prototype这一层多了一些无用的undefined属性)
// VipPerson.prototype = new Person();
// VipPerson.prototype.constructor = VipPerson; //重写construtor
// 寄生组合继承
VipPerson.prototype = Object.create(Person.prototype, {
constructor: { //重写construtor
value: VipPerson,
enumerable: false,
configurable: true,
writable: true
}
})
var vipPerson = new VipPerson('amie',3);
es6的写法:
相比于es5,es6的写法简化了很多,extends、super就可以完成上面寄生组合继承的效果
super,可以看成 Person.call(this, name)。
class Person{
constructor(name){
this.name = name;
}
sayName(){
alert(this.name);
}
}
class VipPerson extends Person{
constructor(name,level){
super(name);
this.level = level;
}
}
var person2 = new VipPerson('rick',3)
继承之es5对比es6的更多相关文章
- js类的继承,es5和es6的方法
存在的差异:1. 私有数据继承差异 es5:执行父级构造函数并且将this指向子级 es6:在构造函数内部执行super方法,系统会自动执行父级,并将this指向子级2. 共有数据(原型链方法)继承的 ...
- 多角度对比 ES5与ES6的区别
ES5与ES6的对比不同点整理 本文关键词:ES6,javascript, 1.Default Parameters(默认参数) es6之前,定义默认参数的方法是在一个方法内部定义 var link ...
- ES5与ES6对比
ES5与ES6对比 1. 模块引用 1.在ES5里,引入React包基本通过require进行,代码类似这样: // ES5 var React = require('react'); var { C ...
- React入门 (1)—使用指南(包括ES5和ES6对比)
前言 本篇会简明扼要的介绍一下React的使用方法.代码会用JSX+ES5和JSX+ES6两种方式实现. React简介 React来自Facebook,于2013年开源.至今不断修改完善,现在已经到 ...
- ES5和ES6中对于继承的实现方法
在ES5继承的实现非常有趣的,由于没有传统面向对象类的概念,Javascript利用原型链的特性来实现继承,这其中有很多的属性指向和需要注意的地方. 原型链的特点和实现已经在之前的一篇整理说过了,就是 ...
- 详解ES5和ES6的继承
ES5继承 构造函数.原型和实例的关系:每一个构造函数都有一个原型对象,每一个原型对象都有一个指向构造函数的指针,而每一个实例都包含一个指向原型对象的内部指针, 原型链实现继承 基本思想:利用原型让一 ...
- ES5与ES6中的继承
ES5继承在ES5中没有类的概念,所以一般都是基于原型链继承,具体的继承方法有以下几种: 父类: function Father (name) { this.name = name || 'sam' ...
- es5与es6继承思考
es5与es6继承思考 es6继承 class Father{ constructor(name){ this.name = name; } getName(){ console.log(this.n ...
- ES5和ES6中的继承
看到一篇写的非常好的关于js继承的文章,其中对构造函数.原型.实例之间的关系的描述十分透彻,故转载作者文章以随时学习,并供大家共同进步! ES5 ES5中的继承,看图: function Super( ...
随机推荐
- 实验二Java面向对象程序设计_20135129李畅宇
ava第二次实验报告 课程:Java实验 班级:201352 姓名:池彬宁 学号:20135212 成绩: 指导教师:娄佳鹏 实验日期:15.05.05 ...
- Linux内核设计与实现 第十七章
1. 设备类型 linux中主要由3种类型的设备,分别是: 设备类型 代表设备 特点 访问方式 块设备 硬盘,光盘 随机访问设备中的内容 一般都是把设备挂载为文件系统后再访问 字符设备 键盘,打印机 ...
- 第三个spring冲刺第4天
今天,我们在难度选择方面做了谈论,根据难度选择题目的难易和数量,在计时器方面应该有相应的配合,由此决定难易度,因此,我们要做好谈论,为这个难易度做好准备去编译,以免出现混乱.
- vue为app做h5页面,如何做到同域名对应不同版本的h5代码
1.当我们在做混合开发的时候,app端可以有无数多个版本,一般情况h5页面只有一套代码.应该如何部署多套代码呢? 2.业务场景 当出现这种情况的时候,其实前端可以部署多套代码.比如: www.stat ...
- vue的使用1
Vue.$set(object, key, value); <!-- Alt + C --> <input @keyup.alt.="clear"> < ...
- [转帖]关于网络编程中MTU、TCP、UDP优化配置的一些总结
关于网络编程中MTU.TCP.UDP优化配置的一些总结 https://www.cnblogs.com/maowang1991/archive/2013/04/15/3022955.html 感谢原作 ...
- Oracle ORDS的简单SQL配置模板
1. 先加上简单的SQL配置模板. DECLARE PRAGMA AUTONOMOUS_TRANSACTION; BEGIN ORDS.ENABLE_SCHEMA(p_enabled => TR ...
- C++ 类的静态成员变量及静态成员函数
ps:下面所说 成员=成员变量+成员函数: 作用 由于对象与对象之间的成员变量是相互独立的.所以要想共用数据,则需要使用静态成员和静态函数. 空间分配 静态成员是在程序编译时分配空间,而在程序结束时释 ...
- js數組
數組對象創建: var a=new Array(); var b=new Array(1); var a=new Array(“AA“,”AA“): 相關函數: sort()排序,可以進行字面上排序s ...
- QueryParser 是对一段话进行分词的 用于收集客户端发来的