class 中的構造方法、static代碼塊、私有/公有/靜態/實例屬性、繼承 ( extends、constructor、super()、static、super.prop、#prop、get、set )

-Advertisement-

前言最近利用閑暇時間把webpack系統的學習了下，搭建出一個react環境的腳手架，寫篇文章總結一下，幫助正在學習webpack小伙伴們，如有寫的不對的地方或還有可以優化的地方，望大佬們指出，及時改正。 git項目地址：https://github.com/handsomezyw/my-webp ...

part 1

/** * << class 中的 static 代碼塊與 super.prop 的使用 * * - 類中的 static 代碼塊。 * 該類型代碼塊可以有多個，這些代碼塊在類定義的時候執行， * 執行順序是自上而下逐個執行。 * | 該代碼塊中的 this 指向當前的類，在代碼塊中可以直接通過 new this() 來創建類的實例。 * | this.prototype.constructor === this * | 在該代碼塊中可以通過 super.prop 來讀取該類所繼承的父級類的靜態屬性。 * super不能單獨使用，否則便會報錯： * "super" 的後面必須是參數列表或成員訪qifuji問 * super後面必須得跟屬性名。 * | 一個類沒有通過 extends 明文設定其父級類的情況下，該類也是預設存在父類的。 * 在 static 代碼塊中 super.valueOf() === this 始終為 true。 * * - 類中定義的 static 方法，在方法體中也可以使用 super.prop 來讀取該類所繼承的父級類的靜態屬性。 * 這種情況下，只支持如下兩種方式的方法定義方式： * static func() { super.prop } * static func = () => { super.prop } * * - 在對象字面量中使用 super.prop。 * 當一個方法是作為一個對象的屬性出現時，該方法內部可以使用 super.prop 來訪問該對象原型鏈中其父級的屬性。 * | 方法屬性只支持 func() { super.prop } 格式的定義方式。 * | 如下方式定義的方法屬性均會執行報錯：( Uncaught SyntaxError: 'super' keyword unexpected here ) * func: function() { super.prop } * func: function funcname () { super.prop } * func: () => { super.prop } * | 當方法作為一個數組的數組項時，該方法內部也不可以使用 super.prop 。 * 若通過數組引用下標的方式調用該方法，便會報和上一條所述相同的錯： * ([function() { super.prop }])[0] * * - 在類中的實例方法內部使用 super.prop。 * | 假如一個類 A extends 另一個類，然後另一個類也 extends 了一個類，...，每個類上都有實例數值屬性、實例方法屬性， * 這種情況下 new A() 得到對象，會被直接賦值所有上級的實例數值屬性，其各級的實例方法屬性會保留在其原型鏈上。 * | A 的實例方法內部，通過 super.prop 的方式可以也只能訪問到其所有 extends 繼承鏈條上的實例方法屬性， * 但時無法訪問到上級的實例數值屬性，和其自身的實例方法屬性。 * | A 的實例方法內部，可以通過 super.valueOf() 的返回值，訪問當前類及其所有上級的數值、方法實例屬性。 * * * - 附1：在除以上4中情況下的方法體內使用 super.prop，執行時均會報如下錯誤： * Uncaught SyntaxError: 'super' keyword unexpected here * * - 附2：在 static 方法體、代碼塊中，通過 super.prop 來讀取、修改父級屬性時： * | 可以讀取到當前 class 所有 extends 鏈條上的 static 屬性。 * | 當修改上級的 static 屬性時，只能修改上級的 get/set 屬性 ( 執行修改上級的數值屬性時不會報錯，但不會生效 )。 * 另外這種對上級的 get/set 修改也是緩存的修改數據，不會實際修改 get/set 依賴的數值屬性、上級的實際 static 屬性。 * | this.__proto__ === ParentClass // true * super.__proto__ === ParentClass // true */

part 2

/** * << 公有屬性、私有屬性(#prop) * 實例屬性、靜態屬性(static prop) * 數值屬性、訪問器屬性(get/set) * * - 公有屬性( 靜態/實例 )，在同時定義了同名的數值屬性、訪問器屬性的情況下： * 編譯、執行均不會報錯，但是數值屬性會覆蓋訪問器屬性，訪問器屬性不生效。 * - 私有屬性( 靜態/實例 )，在同時定義了同名的數值屬性、訪問器屬性的情況下： * 編譯會異常、執行會報錯。 * 強制同時定義然後執行的話，會報如下錯誤， * Uncaught SyntaxError: Identifier '#prop' has already been declared * - 類中可以同時聲明一對同名的靜態屬性和實例屬性。 * * - 同名的靜態屬性與實例屬性 * | 可以定義同名的靜態公有屬性、實例公有屬性，打包編譯、代碼執行均不會報錯。 * | 不能定義同名的靜態私有屬性、實例私有屬性。 * 打包編譯將會異常，代碼執行會報如下錯誤： * Uncaught SyntaxError: Identifier '#name' has already been declared * - 私有屬性(#prop) * | 只能在類體內部，引用該類自身定義的私有屬性。 * | 對於靜態私有屬性，不能通過 super.#prop 的方式去引用該類 extends 上級的靜態私有屬性， * 也不能通過 ClassName.#prop 的方式來引用類的靜態私有屬性。 * | 對於實例私有屬性，不能用類的實例來引用該類 extends 上級的實例私有屬性。 */

part 3

/** * << class的 constructor * * - 類的 constructor 內部 * | super() 的返回值指向 this ( 有 extends 繼承的類 ) * constructor() { * const result = super() * this === result // true * } * | this.constructor === 當前類 */

您的分享是我們最大的動力!

-Advertisement-

更多相關文章

環世界RimWorld for Mac(模擬建造游戲)中文

Mac建造模擬游戲哪款好玩？環世界RimWorld for Mac是Mac平臺上一款非常好玩的模擬生存游戲。在mac rimworld環世界游戲中，游戲中玩家可以創造一個屬於自己的世界，以上帝視角指揮你的殖民者在陌生星球建立據點，可持續發展並且抵禦掃蕩者的進攻。詳情：環世界RimWorld for ...
Rayman Mini for Mac(雷曼迷你跑酷游戲)中文

Rayman Mini for Mac是一款運行在MacOS平臺上的經典跑酷類游戲，玩家在Rayman Mini可以看到經典的傳統角色，與玩家一起在世界中探險，還有超多全新的角色出現。游戲包含動作橫向跑酷和劇情解謎探索為一體，呈現了一個別樣的世界。詳情：Rayman Mini for Mac(雷曼 ...
Redis 分散式鎖

概述單機架構下，一個進程中的多個線程競爭同一共用資源時，通常使用 JVM 級別的鎖即可保證互斥，以對商品下單並扣庫存為例： public String deductStock() { synchronized (this){ // 獲取庫存值 int stock = Integer.parseIn ...
事物的隔離性和MVCC

JDBC 一、JDBC概述什麼是JDBC？ **JDBC 是使用 Java 語言操作關係型資料庫的一套 API。**這套 API 是交由不同的資料庫廠商實現的。我們利用 JDBC 編寫操作資料庫的代碼，真正執行的是各個資料庫的實現類（驅動）。全稱：（Java DataBase Connectiv ...
iOS的Runtime知識點繁雜難啃，真的理解它的思想，你就豁然開朗了

一、Runtime 1、概念：概念：Runtime是Objective-c語言動態的核心，即運行時。在面向對象的基礎上增加了動態運行，達到很多在編譯時確定方法推遲到了運行時，從而達到動態修改、確定、交換。。。屬性及方法作用：這給程式員寫代碼帶來很大的靈活性，比如說你可以把消息轉發給你想要的對象 ...
Android 自動取色並設置沉浸式狀態欄

Android 自動取色並設置沉浸式狀態欄 - Stars-One的雜貨小窩最近在進行產品的優化,也是研究了下沉浸式狀態欄的實現方法及自動取色,記錄一下筆記設置沉浸式狀態欄 1.添加依賴這裡,是使用了一個Android的工具開源庫來實現了功能,首先需要依賴 // Android的工具類 htt ...
JavaScript快速入門-07-異常處理與調試

7、異常處理與調試 7.1 異常處理 7.1.1 try/catch語句 try/catch語句常用於處理JavaScript中的異常，其基本語法如下所示： try { // 可能出錯的代碼 } catch(error){ // 出錯後，需要做的事 } finally{ // 不管怎樣，都要運行的語 ...
js實現防抖節流

前端項目開發過程中，對一個dom元素動作綁定了事件，但觸發dom函數的動作過於頻繁從而影響頁面性能甚至出現bug的情況，比如：頁面滾動scroll事件、瀏覽器視窗resize事件、輸入框搜索input事件等等，這些事件如果在一段時間內不加限制頻繁觸發必定會導致頁面性能變差，尤其是綁定的事件內包含觸 ...

class 中的 構造方法、static代碼塊、私有/公有/靜態/實例屬性、繼承 ( extends、constructor、super()、static、super.prop、#prop、get、set )

part 1

part 2

part 3

class 中的構造方法、static代碼塊、私有/公有/靜態/實例屬性、繼承 ( extends、constructor、super()、static、super.prop、#prop、get、set )