類別

ES6 導入「類別」的概念而與網頁語言相比 其他程式設計語言的類別這裡的類別是特殊函式 可做為建立範本，讓您建立內含資料、屬性的物件 以及與這些資料操弄相關的方法。 這些物件、屬性和方法統稱為「成員」的 類別

如要定義類別，請使用 class 關鍵字。請遵循最佳做法 按照 JavaScript 內建建構函式函式建立的慣例，這種慣例就沒有 包含大寫字母類別的 ID：

class MyClass {}

課程旨在提供更多無障礙工作方式 原型和建構函式函式的功能：

class MyClass {}

typeof MyClass;
> "function"

因為是為了使用進階 JavaScript 而新增類別 並讓這些功能更吸引人，有時也稱為 「語法糖」。不過 類別不僅要提供實用的簡略工作 通訊協定繼承。 推出類別語法創造契機，進而解決長久以來的設計 但沒有發生回溯相容性問題與一起 舉例來說，類別主體中的所有程式碼一律會在 嚴格模式。

如要建立類別的執行個體，請使用 new 運算子。

class MyClass {}

const myClassInstance = new MyClass();

myClassInstance;
> Object { }

類別主體內定義的函式會公開為 該類別的例項

class MyClass {
    classMethod() {
        console.log( "My class method." );
    }
}

const myClassInstance = new MyClass();

myClassInstance.classMethod();
> "My class method."

在類別中定義的方法，會成為 所產生執行個體由於 原型鏈進行呼叫 直接呼叫這些方法：

class MyClass {
  classMethod() {
    console.log( "My class method." );
  }
}

const myClassInstance = new MyClass( "A string." );

myClassInstance;
> Object { }
    <prototype>: Object { … }
        classMethod: function classMethod()
        constructor: class MyClass { constructor(myPassedValue) }
        <prototype>: Object { … }

myClassInstance.classMethod();
> "My class method."

建立類別的執行個體會呼叫特殊的 constructor() 方法，而該方法會呼叫 執行任何必要的「設定」以便用於新建立的執行個體 所有相關聯的屬性當 您可以透過 constructor() 方法建立執行個體：

class MyClass {
  constructor( myPassedValue ) {
    console.log( myPassedValue );
  }
}

const myClassInstance = new MyClass( "A string." );
> "A string."

在類別主體中，this 的值是指例項本身。 其中，任何在 this 中定義的屬性，都會以下列各例項的屬性形式公開： 該類別：

class MyClass {
  constructor( myPassedValue ) {
    this.instanceProperty = myPassedValue;
  }
}

const myClassInstance = new MyClass( "A string." );

myClassInstance;
> Object { instanceProperty: "A string." }

這些屬性也適用於類別主體中的所有方法：

class MyClass {
  constructor( myPassedValue ) {
    this.instanceProp = myPassedValue;
  }
  myMethod() {
    console.log( this.instanceProp );
  }
}

const myClassInstance = new MyClass( "A string." );

myClassInstance.myMethod();
> "A string."

如未為類別定義 constructor()，JavaScript 引擎就會呈現 假設為空白的「預設」constructor。每個類別只能有一個 名為 constructor() 的方法：

class MyClass {
  constructor() {}
  constructor() {}
}
> Uncaught SyntaxError: A class may only have one constructor

您可以使用類別宣告或 類別運算式。先前的範例全都是類別宣告 而這類呼叫需要使用 new 叫用名稱。類別運算式可以命名或命名 離開未命名以建立「匿名」類別

let ClassExpression = class {
    constructor() {}
};

ClassExpression;
> class  {}

匿名類別運算式的其中一種用途 「即時」建構類別：

function classMaker() {
  return class {
    constructor() {}
  };
}

let MyVariable = classMaker();

MyVariable;
> class  {}

使用類別宣告重新宣告類別會導致語法錯誤：

class MyClass {
    constructor( ) {
        console.log( "My class." );
    }
};

class MyClass {
    constructor() {
        console.log( "My new class." );
    }
};
> Uncaught SyntaxError: redeclaration of class MyClass

不過，類別運算式可讓您重新定義類別：

let ClassExpression = class MyClass { };

ClassExpression = class MyOtherClass {
    constructor( myString ) {
        this.myProp = myString;
    }
};

new ClassExpression( "String." );
> MyOtherClass {myProp: 'String.'}

不得使用類別的名稱叫用已命名的類別運算式 宣告內容不過，類別運算式指派的名稱是以 屬性，主要用來簡化偵錯作業：

let MyVariable = class MyClass {};

MyClass;
> Uncaught ReferenceError: MyClass is not defined

MyVariable;
> class MyClass {}

MyVariable.name;
> "MyClass"

使用類別運算式初始化變數時， 提升規則 正確地接在變數後方類別宣告會遵循 同樣「暫時死區間」let 和 const 假設他們尚未提升至目前範圍 這意味著在類別宣告之前叫用類別會導致錯誤：

{
    let myVar = new MyClass( "Property string." );

    class MyClass {
        myProp;

        constructor( myString ) {
            this.myProp = myString;
        }
    };
};
> Uncaught ReferenceError: Cannot access 'MyClass' before initialization

隨堂測驗