如何使用JavaScript類

2015年,ECMAScript 6(ES6)標準引入了類。了解所有關於他們的信息

2015年,ECMAScript 6(ES6)標準引入了類。

JavaScript有一種非常不常見的實現繼承的方法:原型繼承。原型繼承在我看來很棒,但是與大多數其他流行的編程語言基於類的繼承實現不同。

來自Java或Python或其他語言的人們很難理解原型繼承的複雜性,因此ECMAScript委員會決定在原型繼承的基礎上撒上語法糖,以使其類似於基於類的繼承在其他流行實現中的工作方式。

這很重要:底層的JavaScript仍然相同,並且您可以以通常的方式訪問對象原型。

類定義

這是一堂課的樣子。

class Person {
  constructor(name) {
    this.name = name
  }

hello() { return 'Hello, I am ’ + this.name + ‘.’ } }

一個類有一個標識符,我們可以使用它來創建新對象new ClassIdentifier()

初始化對像後,constructor調用方法,並傳遞任何參數。

一個類還具有所需的許多方法。在這種情況下hello是一個方法,可以在派生自此類的所有對像上調用:

const flavio = new Person('Flavio')
flavio.hello()

類繼承

一個類可以擴展另一個類,並且使用該類初始化的對象將繼承這兩個類的所有方法。

如果繼承的類具有與層次結構中較高級別的類之一名稱相同的方法,則最接近的方法優先:

class Programmer extends Person {
  hello() {
    return super.hello() + ' I am a programmer.'
  }
}

const flavio = new Programmer(‘Flavio’) flavio.hello()

(以上程序打印“您好,我是弗拉維奧。我是電腦程序編制員。”)

類沒有顯式的類變量聲明,但是必須在構造函數中初始化任何變量。

在一個類中,您可以引用父類調用super()

靜態方法

通常,方法是在實例上定義的,而不是在類上定義的。

靜態方法改為在類上執行:

class Person {
  static genericHello() {
    return 'Hello'
  }
}

Person.genericHello() //Hello

私人方法

JavaScript沒有內置的方法來定義私有或受保護的方法。

有解決方法,但在此不再贅述。

吸氣劑和二傳手

您可以添加以開頭的方法get或者set創建一個getter和setter,這兩個是根據您所執行的代碼的兩個不同部分:訪問變量或修改其值。

class Person {
  constructor(name) {
    this._name = name
  }

set name(value) { this._name = value }

get name() { return this._name } }

如果只有getter,則無法設置該屬性,並且這樣做的任何嘗試(在構造函數之外,當您使用此類初始化新對象時都會設置值)將被忽略:

class Person {
  constructor(name) {
    this._name = name
  }

get name() { return this._name } }

如果只有二傳手,則可以更改值,但不能從外部訪問它:

class Person {
  constructor(name) {
    this._name = name
  }

set name(value) { this._name = value } }

當您想在更改屬性值時執行一些代碼,或者要創建“計算”屬性時,getter和setter很有用。您可以使用getter更改返回的值。

您還可以運行一些代碼,例如在更改值時登錄到控制台或文件。

免費下載我的JavaScript初學者手冊


更多js教程: