[資料結構] 學習筆記 — 0. JavaScript Class

source: JavaScript Algorithms and Data Structures Masterclass

因為 Colt 在資料結構課程的部分會利用 JavaScript 的 class 來模擬建立一項特定的資料結構、它會有的屬性（property），例如 Singly Linked List 的 node、value、next 跟方法（method），利如 add、delete ⋯⋯，預防有些人還不熟悉 class 的使用，先來介紹一下。

Constructor 創建子

class 關鍵字之後會接一個該 class 的名稱，慣例大寫：

class Student { ... }

class 物件裡面第一個關鍵字是 constructor，定義這個 class 會有的 property 是什麼，如果有預設值也會在這邊設定。例如每個 Student 創建時要帶有 firstname、lastname、grade，firstname、lastname、grade 就是 Student 的 property：

class Student {
    constructor(firstname, lastname, year) {
        this.firstname = firstname
        this.lastname = lastname
        this.grade = year
    }
}

• 創建子一定要使用 constructor
• class 會建立一個常數，所以不能再重新定義同樣的常數

let firstStudent = new Student("Colt", "Steele", 3)
let secondStudent = new Student("Blue", "Steele", 2)

Instance Method

一旦創建了某項 class 並且定義了它的屬性之後，就能以 function 的方式定義該項 class 可用的 method。

例如這邊範例的顯示全名（fullname）、紀錄遲到（markLate）、填寫成績（addScore）和計算平均（calculateAverage）：

class Student {
    constructor(firstname, lastname, year) {
        this.firstname = firstname
        this.lastname = lastname
        this.grade = year
        this.tardies = 0
        this.scores = []
    }

    fullname() {
        return `Your name is ${this.firstname} ${this.lastname}.`
    }

    markLate() {
        this.tardies += 1
        if (this.tardies > 3) return 'You are expelled!'
        return `{this.firstname} ${this.lastname} has been late ${this.tardies} times.`
    }

    addScore(score) {
        this.scores.push(score)
        return this.scores
    }

    calculateAverge() {
        let sum = this.score.reduce((a, b) => return a + b)
        return sum / this.scores.length
    }
}

Static：Class Method

前面的 Instance Method 是用在創建某一個 class 實例（instance）的方法，它會跟 class 某個實例作連結。

而 static 關鍵字則是用來定義針對該 class 的方法，它無關於某一項特定的實例，而是屬於整個 class。

class Student {
    constructor(firstname, lastname, year) {
        this.firstname = firstname
        this.lastname = lastname
        this.grade = year
        this.tardies = 0
        this.scores = []
    }

    fullname() {
        return `Your name is ${this.firstname} ${this.lastname}.`
    }

    markLate() {
        this.tardies += 1
        if (this.tardies > 3) return 'You are expelled!'
        return `{this.firstname} ${this.lastname} has been late ${this.tardies} times.`
    }

    addScore(score) {
        this.scores.push(score)
        return this.scores
    }

    calculateAverge() {
        let sum = this.score.reduce((a, b) => return a + b)
        return sum / this.scores.length
    }

    static EnrollStudents() {
        return 'Enrolling students!'
    }
}

我們不能這樣做：

fitstStudent.EnrollStudents()  // Uncaught TypeError

而必須針對 class 呼叫方法：

Student.EnrollStudents()    // 'Enrolling students!'

因為之前很少遇到 class 的使用場景，感謝 Colt 這一系列都用 class 帶，增加了不少熟悉度～

下一篇：[資料結構] 學習筆記 — 1. Singly Linked List 單向資料鏈結