super 关键字

我们知道,this关键字总是指向函数所在的当前对象,ES6 又新增了另一个类似的关键字super,指向当前对象的原型对象。

  1. const proto = {
  2. foo: 'hello'
  3. };
  4. const obj = {
  5. find() {
  6. return super.foo;
  7. }
  8. };
  9. Object.setPrototypeOf(obj, proto);
  10. obj.find() // "hello"

上面代码中,对象objfind方法之中,通过super.foo引用了原型对象protofoo属性。

注意,super关键字表示原型对象时,只能用在对象的方法之中,用在其他地方都会报错。

  1. // 报错
  2. const obj = {
  3. foo: super.foo
  4. }
  5. // 报错
  6. const obj = {
  7. foo: () => super.foo
  8. }
  9. // 报错
  10. const obj = {
  11. foo: function () {
  12. return super.foo
  13. }
  14. }

上面三种super的用法都会报错,因为对于 JavaScript 引擎来说,这里的super都没有用在对象的方法之中。第一种写法是super用在属性里面,第二种和第三种写法是super用在一个函数里面,然后赋值给foo属性。目前,只有对象方法的简写法可以让 JavaScript 引擎确认,定义的是对象的方法。

JavaScript 引擎内部,super.foo等同于Object.getPrototypeOf(this).foo(属性)或Object.getPrototypeOf(this).foo.call(this)(方法)。

  1. const proto = {
  2. x: 'hello',
  3. foo() {
  4. console.log(this.x);
  5. },
  6. };
  7. const obj = {
  8. x: 'world',
  9. foo() {
  10. super.foo();
  11. }
  12. }
  13. Object.setPrototypeOf(obj, proto);
  14. obj.foo() // "world"

上面代码中,super.foo指向原型对象protofoo方法,但是绑定的this却还是当前对象obj,因此输出的就是world

es6 super 关键字相关推荐

  1. es6 super关键字

    super关键字 super这个关键字,既可以当作函数使用,也可以当作对象使用.在这两种情况下,它的用法完全不同. 第一种情况,super作为函数调用时,代表父类的构造函数.ES6 要求,子类的构造函 ...

  2. ES6——super关键字

    super关键字有两种使用场景 1.当用作方法时 在ES6的构造函数中,ES6的语法规定,在继承于父类的子类的构造函数中,必须使用super(),因为在子类中是不存在上下文指向(this)的,需要使用 ...

  3. ES6的 super 关键字

    Class之间可以通过extends关键字实现继承,这比ES5的通过修改原型链实现继承,要清晰和方便很多. 子类必须在constructor方法中调用super方法,否则新建实例时会报错. 这是因为子 ...

  4. ES6 (二十二)Class 的继承、extends关键字、super 关键字(函数调用(constructor)、对象(父类原型对象))、原型对象(原型链)、Mixin 模式

    ES6 (二十二)Class 的继承.extends关键字.super 关键字(函数调用(constructor).对象(父类原型对象)).原型对象(原型链).Mixin 模式 文章目录 ES6 (二 ...

  5. ES6 class关键字 ~ 非常详细

    下面的对ES6中class关键字的整理,希望可以帮助到有需要的小伙伴~ 文章目录 类的声明 构造函数 getter与setter 不允许提前声明 不允许重复声明 静态方法 静态方法的语法 类的继承 实 ...

  6. JavaScript中解析super关键字

    虽互不曾谋面,但希望能和您成为笔尖下的朋友 以读书,技术,生活为主,偶尔撒点鸡汤 不作,不敷衍,意在真诚吐露,用心分享 点击左上方,可关注本刊 标星公众号(ID:itclanCoder) 如果不知道如 ...

  7. This和Super关键字的对比

    this和Super关键字 this和Super关键字的对比 Super关键字的用法如下: 1. super关键字代表了父类空间的引用: 2. super关键字的作用: 3. super关键字调用父类 ...

  8. Java基础学习总结(8)——super关键字

    2019独角兽企业重金招聘Python工程师标准>>> 一.super关键字 在JAVA类中使用super来引用父类的成分,用this来引用当前对象,如果一个类从另外一个类继承,我们 ...

  9. Java面向对象之继承,方法重写,super关键字,员工类系列继承题

    在程序中,如果想声明一个类继承另一个类,需要使用extends关键字. 格式: class 子类 extends 父类 {} 继承的好处 1.继承的出现提高了代码的复用性,提高软件开发效率. 2.继承 ...

最新文章

  1. HTTP Host 头攻击,是什么鬼?
  2. f150platinum_新款福特F150PLATINUM精英版皮卡超强越野实力展示
  3. Windows上也能用Swift编程了,官方编译工具安装包现已上线
  4. docker环境安装redis
  5. C/C++宏的使用总结
  6. Linux下vsftpd的安装,Java上传文件实现。
  7. TreeMap按照value进行排序
  8. 基于jqUI的日期选择(‘yy-mm-dd’)
  9. 人工智能在医疗领域的应用
  10. Ffmpeg实例,为视频添加一个循环播放的背景音乐(混声)
  11. 推荐电视剧 大秦帝国之裂变 2008
  12. BZOJ 4565 字符合并 (区间状压dp)
  13. Vue 3.0 Ref-sugar 提案到底是啥,真的是自寻死路吗?
  14. Python学习笔记--正方形、六边形、叠边形、同切圆的绘制
  15. 1.2字符类型及操作
  16. 图片文字的居垂直居中对齐属性:vertical-align:middle
  17. 快乐生活的1000+篇文章总结
  18. 【JavaScript实现十进制转换成二进制】
  19. Arduino连接nRF24L01无线收发模块
  20. leetcode刷题:292. Nim 游戏(Java)

热门文章

  1. Node.js压缩web项目中的js,css和图片
  2. android客户端从服务器端获取json数据并解析的实现代码
  3. PHP微信公众平台源码 支持多账号 仿pigcms 小猪微信 已经修改完毕 完整可用
  4. 微软通信winusb —— 不再为你的usb设备编写驱动
  5. 睡觉时,禁带6种东西,最后一点最严重,可能致命
  6. 活力四射的Windows Embedded Standard 7
  7. 程序员的算法课(5)-动态规划算法
  8. 轻松在阿里云上搭建Redis
  9. Java集合系列---Collection源码解析及整体框架结构
  10. linux中不同版本的gcc切换,Ubuntu 14.04中升级gcc到版本4.9.2并切换使用它们