ES6中的super关键字

- 日理万妓 2022-02-22 12:50 268阅读 0赞

在其它面向对象的语言中都能看到一个关键字`super`。这个关键字的含义通常是“父类”的意思。而在Javascript中，`super`换了一个与“父类”相近的含义，即“原型（prototype）”。

let proto = {
        
      foo: 'hello'
    };
    
    let obj = {
        
      foo: 'world',
      find() {
        
        return super.foo;
      }
    };
    
    Object.setPrototypeOf(obj, proto);
    obj.find() // "hello"

上面的代码中通过`Object.setPrototypeOf`方法为`obj`设定其原型对象为`proto`。

需要注意的是，**`super`关键字仅能用在对象的方法之中，用在其他的地方都会报错**

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hqYzI1Ng_size_16_color_FFFFFF_t_70]

上面的错误中，第一种写法是将`super`用在了属性内，但是第二和第三中写法是写在方法内，却也报了错，这是为何？

**原因在于，目前只有对象方法的简写法可以让JavaScript引擎确认定义的是对象的方法。**

还有一种错误，即`super`关键字不能单独使用。意思是说，必须访问`super`的属性或方法，不然就会报错，例如：

![在这里插入图片描述][20190409124117929.png]

这样单独使用`super`是会报错的，而访问其属性之后则不会：

![在这里插入图片描述][20190409124127358.png]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2hqYzI1Ng_size_16_color_FFFFFF_t_70]: /images/20220222/47f8585f2198402d87622315d65dc4b4.png
[20190409124117929.png]: /images/20220222/727f06f610aa47709bf0e6958ad8f5cb.png
[20190409124127358.png]: /images/20220222/36dd40f3410b4c5b99d078ebddf4c753.png

发表评论取消回复

表情：

评论列表（有 0 条评论，268人围观）

还没有评论，来说两句吧...

相关阅读

相关 Java中的super关键字

一、super关键字是干什么的？简单来说，就是子类中重写的方法，既需要调用父类的方法，又需要再额外增加一些自己的东西。已经在Java的继承这篇文章中使用过super关键

╰+哭是因爲堅強的太久メ/ 2024年03月31日 14:43/ 0 赞/ 57 阅读

相关【ES6】Class继承-super关键字

目录一、前言二、ES6与ES5继承机制区别三、super作为函数 1、构造函数this 1）、首先要明确this指

た入场券/ 2024年02月05日 19:37/ 0 赞/ 56 阅读

相关 Java中super关键字及super()的使用

Java中super关键字及super()的使用： 1、super的使用：（1）super是一个关键字。（2）super和this很类似，我们对比着学习。 ----

深藏阁楼爱情的钟/ 2023年02月23日 08:47/ 0 赞/ 14 阅读

相关 ES6中属性以及方法的继承(super)

<script> //创建一个Father类 class Father{ //利用constructor来创建属性 constructor(name,age){ thi

柔情只为你懂/ 2023年02月19日 14:22/ 0 赞/ 10 阅读

相关 ES6 Class 中的 super 关键字

以下只是个人的学习笔记： super这个关键字，既可以当作函数使用，也可以当作对象使用。在这两种情况下，它的用法完全不同。 1、当作函数使用 class A

落日映苍穹つ/ 2022年06月07日 12:07/ 0 赞/ 190 阅读

相关 ES6 super关键字

我们知道，this关键字总是指向函数运行时所在的当前对象，ES6 又新增了另一个类似的关键字super，指向当前对象的原型对象。 let prop = {

男娘i/ 2022年06月06日 20:29/ 0 赞/ 189 阅读

相关 es6的yield关键字

原文地址：[http://www.zhufengpeixun.com/qianduanjishuziliao/javascriptzhuanti/2017-03-25/740.

拼搏现实的明天。/ 2022年05月31日 07:28/ 0 赞/ 261 阅读

相关 ES6中的super关键字

在其它面向对象的语言中都能看到一个关键字`super`。这个关键字的含义通常是“父类”的意思。而在Javascript中，`super`换了一个与“父类”相近的含义，即“原型（

- 日理万妓/ 2022年02月22日 12:50/ 0 赞/ 269 阅读

相关 es6 super()

constructor() \{ super(); \} super（）不能少！！！！！！！！！！！首先，ES6 的 `class` 属于一种“语法糖”，所以只是写法

一时失言乱红尘/ 2021年11月05日 03:31/ 0 赞/ 262 阅读

相关 Java 中的super关键字

super关键字表示对某个类的父类的引用。一般而言，super有两种通用形式：第一种用来访问被子类的成员隐藏的父类成员；第二种则是可以调用父类的构造函数。接下来说一下两种使用形

心已赠人/ 2021年06月24日 15:59/ 0 赞/ 462 阅读