ES5和ES6继承的区别「建议收藏」

ES5和ES6继承的区别「建议收藏」前端面试题之JSES5和ES6继承的区别ES5的继承方法可以看这篇:https://mp.csdn.net/mdeditor/83098432#ES5与ES6的继承方法对照:ES5functionParent(){this.name=’parent’;this.arr=[1,2,3,4];}Parent.prototype.say=functio…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

ES5的继承方法可以看这篇:
https://blog.csdn.net/qq593249106/article/details/83098432

ES5与ES6的继承方法对照:

ES5

function Parent() { 
   
    this.name = 'parent';
    this.arr = [1,2,3,4];
}
Parent.prototype.say = function () { 
   
    console.log('say');
};
function Child(age) { 
   
    Parent.call(this);
    this.age = age;
}
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;
var c = new Child(12);
console.log(c.name); //输出parent
c.say(); //输出say
console.log(c.constructor); //输出function Child(age) {Parent.call(this);this.age = age;}
console.log(new Parent().constructor); //输出Parent() {this.name = 'parent';this.arr = [1,2,3,4];}

Jetbrains全家桶1年46,售后保障稳定

ES6

class Parent2 { 
   
    constructor() { 
   
        this.name = 'parent';
    }
}
Parent2.prototype.say = function () { 
   
    console.log('say');
};
class Child2 extends Parent { 
   
    constructor(age) { 
   
        super();
        this.age = age;
    }
}
var c2 = new Child2(12);
console.log(c2.name); //输出parent
c2.say(); //输出say
console.log(c.constructor); //输出function Child(age) {Parent.call(this);this.age = age;}
console.log(new Parent().constructor); //输出Parent() {this.name = 'parent';this.arr = [1,2,3,4];}

ES5的继承实质上是先创建子类的实例对象,然后再将父类的方法添加到this上(Parent.apply(this)),然后再把原型链继承。

ES6的继承机制完全不同,实质上是先创建父类的实例对象this(所以必须先调用父类的super()方法,才可使用this关键字,否则报错。),然后再用子类的构造函数修改this实现继承。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/230919.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 基于人脸识别的考勤系统:Python3 + Qt5 + OpenCV3 + FaceNet + MySQL

    基于人脸识别的考勤系统:Python3 + Qt5 + OpenCV3 + FaceNet + MySQL本项目使用Python3.8编写,QtDesigner(QT5)设计主界面,PyQt5库编写控件的功能,使用开源FaceNet人脸识别算法进行人脸识别,使用眨眼检测来实现活体识别,使用OpenCV3实现实时人脸识别。同时,将班级学生信息,各班级学生人数、考勤信息录入到MySQL数据库中,方便集中统一化管理。因为本项目仅由我一个人开发,能力精力有限,实现了预期的绝大多数功能,但是活体检测功能还存在bug,如果小伙伴对本项目中有不懂的地方或者发现问题,欢迎提出。

    2022年5月13日
    44
  • 图遍历问题

    图遍历问题图遍历问题分为四类遍历完所有的边而不能有重复,即所謂“一笔画问题”或“欧拉路径”;遍历完所有的顶点而没有重复,即所谓“哈密尔顿问题”。遍历完所有的边而可以有重复,即所谓“中国邮递员问题”;遍历完所有的顶点而可以重复,即所谓“旅行推销员问题”。对于第一和第三类问题已经得到了完满的解决,而第二和第四类问题则只得到了部分解决。第一类问题就是研究所谓的欧拉图的性质,而第二类问题则是…

    2022年6月4日
    75
  • Mybatis分页插件使用的详解[通俗易懂]

    Mybatis分页插件使用的详解[通俗易懂]前言关于分页,一般来说rowBounds这种假分页都上不了台面,我们往往都选哟真分页,那么还不想搞得很麻烦,Mybatis的分页插件就为后端程序员解决了这个问题例子首先需要导入依赖,没错pagehelper<dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper</artifactId><v

    2022年10月9日
    3
  • PHP array_multisort()函数超详细理解

    PHP array_multisort()函数超详细理解

    2021年10月25日
    44
  • json转字符串 python_Python读取json

    json转字符串 python_Python读取json序列化与反序列化按照某种规则,把内存中的数据保存到文件中,文件是一个字节序列,所以必须要把内存数据转换成为字节序列,输出到文件,这就是序列化;反之,从文件的字节恢复到内存,就是反序列化;pytho

    2022年7月28日
    4
  • monkeybuddy插件_v8引擎是什么意思

    monkeybuddy插件_v8引擎是什么意思介绍   SpiderMonkey是Firefox使用的脚本引擎,V8是GoogleChrome使用的脚本引擎。这篇文章介绍了怎样在自己的C++程序中嵌入这两种脚本引擎,以及简单做了一些横向的对比。 编译SpiderMonkey

    2022年10月16日
    4

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号