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的更多相关文章

  1. js类的继承,es5和es6的方法

    存在的差异:1. 私有数据继承差异 es5:执行父级构造函数并且将this指向子级 es6:在构造函数内部执行super方法,系统会自动执行父级,并将this指向子级2. 共有数据(原型链方法)继承的 ...

  2. 多角度对比 ES5与ES6的区别

    ES5与ES6的对比不同点整理 本文关键词:ES6,javascript, 1.Default Parameters(默认参数) es6之前,定义默认参数的方法是在一个方法内部定义 var link ...

  3. ES5与ES6对比

    ES5与ES6对比 1. 模块引用 1.在ES5里,引入React包基本通过require进行,代码类似这样: // ES5 var React = require('react'); var { C ...

  4. React入门 (1)—使用指南(包括ES5和ES6对比)

    前言 本篇会简明扼要的介绍一下React的使用方法.代码会用JSX+ES5和JSX+ES6两种方式实现. React简介 React来自Facebook,于2013年开源.至今不断修改完善,现在已经到 ...

  5. ES5和ES6中对于继承的实现方法

    在ES5继承的实现非常有趣的,由于没有传统面向对象类的概念,Javascript利用原型链的特性来实现继承,这其中有很多的属性指向和需要注意的地方. 原型链的特点和实现已经在之前的一篇整理说过了,就是 ...

  6. 详解ES5和ES6的继承

    ES5继承 构造函数.原型和实例的关系:每一个构造函数都有一个原型对象,每一个原型对象都有一个指向构造函数的指针,而每一个实例都包含一个指向原型对象的内部指针, 原型链实现继承 基本思想:利用原型让一 ...

  7. ES5与ES6中的继承

    ES5继承在ES5中没有类的概念,所以一般都是基于原型链继承,具体的继承方法有以下几种: 父类: function Father (name) { this.name = name || 'sam' ...

  8. es5与es6继承思考

    es5与es6继承思考 es6继承 class Father{ constructor(name){ this.name = name; } getName(){ console.log(this.n ...

  9. ES5和ES6中的继承

    看到一篇写的非常好的关于js继承的文章,其中对构造函数.原型.实例之间的关系的描述十分透彻,故转载作者文章以随时学习,并供大家共同进步! ES5 ES5中的继承,看图: function Super( ...

随机推荐

  1. 【MOOC EXP】Linux内核分析实验七报告

    程涵  原创博客 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 可执行程序的装载 知识点梳理 一.预处 ...

  2. Web接口测试-HttpClient

    要实现Web接口测试的自动化有许多方式,比如利用Jmeter.Loadrunner等测试工具都能够实现接口的自动化测试,我们也可以利用一些开源的框架来实现接口的自动化测试,比如我们现在要说的这个Htt ...

  3. Windows下面dir 总是输入成ls的一个解决方法

    转帖:http://blog.csdn.net/venusic/article/details/50543058 新建一个ls.bat文件 输入 @echo off dir 然后放到环境变量存在的一个 ...

  4. Jquery ajax ajaxStart()和ajaxStop()加载前的优雅表现

    Jquery中当一个Ajax请求启动时,并且没有其他未完成的Ajax请求时,将调用ajaxStart()方法.同样,ajaxStop()方法则是在所有Ajax请求都完成时调用.这些方法的参数都是一个函 ...

  5. ComboBox中如何嵌套TreeView控件

      在ComboBox中嵌套TreeView控件,有时候我们在设计界面的时候,由于界面设计的需要,我们需要将TreeView控件嵌套在ComboBox中,因为TreeView控件实在是太占用地方了,要 ...

  6. (String)强制转换、toString()和String.valueOf()的区别

    String:毫无疑问,这种就是强转形式,简单方便,效率高.java程序员可能看到效率高或许有些激动,但是它有他的不好,那就是局限性.在java的世界里没有什么东西是没有缺点的,总有一些好的方面同时也 ...

  7. Java微信二次开发(五)

    消息加密 需要到入库:commons-io-2.4.jar,commons-codec-1.9.jar(在官网的Java微信加密demo下) 第一步:访问https://mp.weixin.qq.co ...

  8. Delphi中的构造函数的override的问题

    TObject的构造方法Create不能被override.因为它是一个静态方法.

  9. html 腳本

    腳本引入: <script type="text/script"> document.write("hello")</script> 腳 ...

  10. Java之map使用方法

    package basic; import java.util.HashMap; import java.util.Map; //map使用方法 public class MapDemo { publ ...