JavaScript中的Super（）是什麼？

在JavaScript中了解super() ：本指南探討了JavaScript中的super()關鍵字，重點是從父類中繼承。儘管JavaScript的類系統建立在原型繼承上， super()提供了熟悉的基於類的繼承語法。

super()關鍵字不是JavaScript所唯一的； Java和Python之類的語言類似地使用它來引用父類。但是，JavaScript的方法有所不同。它利用了對基於類的基於類的繼承行為的原型繼承。 Mozilla的文檔強調，JavaScript類是基於現有原型的繼承的“句法糖”。

讓我們用代碼示例說明。考慮兩個類： Fish （父母）和Trout （孩子）。 Fish具有特性habitat和length 。 Trout擴展了Fish ，增加了variety特性。

類魚{
  構造函數（棲息地，長度）{
    this.habitat =棲息地；
    this.length =長度;
  }
}

鱒魚延伸魚{
  構造函數（棲息地，長度，品種）{
    超級（棲息地，長度）； //致電父母的構造函數
    this.variety =多樣性；
  }
}

在Trout的構造函數中， super(habitat, length)至關重要。它稱為Fish的構造函數，在Trout對象的上下文中建立了habitat和length特性。省略super()將導致參考錯誤。這說明了super()如何將父級的屬性集成到子類中。

重要的是，JavaScript具有靈活性。雖然您必須調用super()以避免錯誤，但您不必傳遞父構建器所期望的確切參數。您可以直接分配屬性：

鱒魚延伸魚{
  構造函數（棲息地，長度，品種）{
    極好的（）;
    this.habitat =棲息地；
    this.length =長度;
    this.variety =多樣性；
  }
}

這種方法雖然不太清楚，但取得了相同的結果。沒有參數的super()創建屬性，但使其不確定，從而允許後續作業。這突出了與Java這樣的真實類繼承模型的關鍵區別。

super()還超越了構造函數。它可以訪問父類方法。讓我們添加一個renderProperties方法以顯示屬性：

類魚{
  RenderProperties（element）{
    element.innerhtml = json.stringify（this）;
  }
}

鱒魚延伸魚{
  RenderPropertieswithsuper（element）{
    element.ClassName =“ green”;
    super.renderproperties（element）; //調用父級的方法
  }
}

Trout的renderPropertiesWithSuper重新使用Fish的renderProperties ，增加了額外的功能。命名（ renderPropertiesWithSuper ）是故意的；它避免覆蓋父母的方法，從而訪問兩者。

重要的是要注意，這種基於類的語法本質上是一種便利。可以在沒有extends和super()情況下實現相同的功能，但具有更複雜的代碼涉及直接的原型操縱。這加強了“句法糖”概念。

總之，JavaScript類在使用原型繼承時，提供了具有super()類似類別的結構。了解這一細微差別以及原型遺傳基本原理，是有效使用JavaScript中的類的關鍵，尤其是在諸如React之類的框架中。

以上是JavaScript中的Super（）是什麼？的詳細內容。更多資訊請關注PHP中文網其他相關文章！