淺談ES6中class語法糖中super關鍵字

作用:
  • super 關鍵字用于訪問父對象上的函數(shù)。
語法:
  • super([arguments]); // 訪問父對象上的構造函數(shù)
  • super.functionOnParent([arguments]); // 訪問父對象上的方法
詳解:
  • super可以用在類的繼承中,或者對象字面量中,super指代了整個prototype或者proto指向的對象
  1. 類(prototype相關)

a. 用在子類constructor函數(shù)中

class Person {
    constructor(name) {
        this.name = name;
    }
}
class Student extends Person {
    constructor(name, age) {
        super(); // 用在構造函數(shù)中,必須在使用this之前調用
        this.age = age;
    }
}

super()調用會生成一個空對象,作為context來調用父類的constructor,返回this對象,作為子類constructor的context繼續(xù)調用構造函數(shù)。
context:執(zhí)行上下文 constructor:構造函數(shù)

b. 調用父類的靜態(tài)函數(shù)

class Human {
    constructor() {}
    static ping() {
        return 'ping';
    }
}

class Computer extends Human {
    constructor() {}
    static pingpong() {
        return super.ping() + ' pong';
    } // 只有在子類的靜態(tài)函數(shù)中才能調用父類的靜態(tài)函數(shù)(babel環(huán)境測試,按理說,在實例函數(shù)中應該也可以調用,不過實際測試環(huán)境中報錯)
}
Computer.pingpong(); // 'ping pong'
  1. 對象的字面量(proto項目)
var obj1 = {
    method1() {
        console.log("method 1");
    }
}

var obj2 = {
    method2() {
        super.method1();
    }
}
// 必須利用setPrototypeOf將第二個對象的原型設為第一個對象
Object.setPrototypeOf(obj2, obj1);
obj2.method2(); // logs "method 1"

轉載至:https://www.cnblogs.com/liutie1030/p/5997446.html

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • class的基本用法 概述 JavaScript語言的傳統(tǒng)方法是通過構造函數(shù),定義并生成新對象。下面是一個例子: ...
    呼呼哥閱讀 4,126評論 3 11
  • 2016.9.9 第6章 原型與面向對象 原型雖然是定義對象的一種很方便的方式,但它的本質依然是函數(shù)特性。 使用原...
    如201608閱讀 705評論 0 0
  • 原文:http://dmitrysoshnikov.com/ecmascript/javascript-the-c...
    jaysoul閱讀 483評論 0 0
  • 兩個似乎永遠沒有交集的平行線,不知什么時候兩條平行線開始相互靠攏,大概是你的顰蹙一笑,我的小心一跳,然后合集成...
    墨染闌珊閱讀 377評論 0 1
  • 今天是我23歲的生日,昨天晚上夢見了前任,一個晚上一直是他的身影。 有的事我就是杞人憂天,我愿把一切實際化,所以后怕,
    天然美閱讀 166評論 0 0