※ 設計模式與程式架構(二) — TypeScript關鍵字說明

閱讀時間約 5 分鐘

※ TypeScript範例說明:

interface ITest {
test1: string
test2: number

print: (arg: string[]) => boolean
}

class Test implements ITest {
public test1: string
public test2: number

constructor(test1: string, test2: number) {
this.test1 = test1
this.test2 = test2
}

print = (arg: string[]) => {
console.log(this.test1, this.test2, arg)
// return !!arg.length
return Boolean(arg.length)
}
}

const testIns = new Test("hello world", 123)
console.info(testIns.print(["33"])) 


※ Export介紹:

  • 就是讓你可以把某些變量、函數或類別從一個模組拿出來,讓其他模組可以使用它們。這就像你把一些工具從工具箱拿出來給別人用一樣。

※ Interface(介面或是接口)介紹:

  • 描述結構:interface 是用來描述物件的結構,定義了哪些Property(屬性)和Method(方法)必須存在。
  • 不包含實作:interface 只描述屬性和方法,並不包含任何具體的實作細節。
  • 用於約定:interface 就像是一個契約,強制實現它的 class 必須按照這個契約來實現所有的Property(屬性)和Method(方法)。否則就會發生錯誤,無法正確編譯。

 簡單來說Interface 只做描述,不做動作。

※ Class介紹:

  • 實作細節:class 則是具體的實現,定義了物件的具體行為和狀態。它不僅描述了物件應該有什麼樣的屬性和方法,還包括這些方法的具體實現。
  • 實現 Interface:Class 使用 implements 關鍵字來指定要實作的介面(interface)。這意味著class 必須提供 interface 中定義的所有屬性和方法的具體實現。

※ Implements(實作)介紹:

  • 當一個類別「implement」一個接口時,它必須提供這些方法和屬性的具體實現。
  • 目的是確保類(Class)包含介面中所有定義的屬性和方法,否則 TypeScript 編譯器會報錯。

※ Public介紹:

  • 如果希望屬性或方法對所有使用者完全公開時使用 public 修飾符。
  • 預設值:Class 內描述的 Property(屬性) 預設是 Public。

※ Private介紹:

  • private 關鍵字用來保護類裡面的一些資料或方法,使它們只能在這個類內部使用。
  • 好處是確保資料或方法不會被外部的代碼任意地修改或影響。

※ Constructor介紹:

  • 用於在建立類的實例時初始化物件。
  • 每個類只能有一個建構函數(constructor)。

※ Print介紹:

  • 呼叫 print 方法來查看輸出和返回值。

※ Extends介紹:

  • 用於表達繼承關係。
  • 一個類(子類)可以繼承另一個類(父類)的屬性和方法。
  • 子類可以使用父類已有的功能,還可以新增或修改自己的功能。

※ Super介紹:

當一個子類繼承自一個父類時,可以使用 super 關鍵字來調用父類的建構函數。這樣做可以初始化父類中的屬性。

※ Static介紹:

  • 靜態方法:靜態方法可以直接通過類別名稱來調用,而不需要創建類的實例。
  • 靜態屬性:靜態屬性是類別的屬性,所有類的實例共享這個屬性。

abstract 關鍵字

在一個類別(class)前使用 abstract 關鍵字時,表示這個類別是抽象類別,不能直接用來創建物件。抽象類別就像一個藍圖,它定義了一些共用的特性和行為,不能直接用來創建物件,需要用另一個具體的類來繼承這個藍圖,並實作裡面的一些方法

protected 關鍵字

一個受保護的屬性可以在這個類及其子類中訪問,但不能在類的外部訪問。





    全端網頁開發專業知識分享
    留言0
    查看全部
    avatar-img
    發表第一個留言支持創作者!
    ※ 何謂Typescript? Typescript是Microsoft開發出來的一種JavaScript的擴展程式語言。 ※ 為什麼選擇 TypeScript? 靜態型別: 在執行程式碼之前就能避免許多錯誤。 幫助開發人員更快發現型別使用上的問題。 有效提升開發應用程式的效率。 輕鬆
    ※ OPP第三大核心-多型 ※ 多型的基本定義: 多型是利用繼承的特性,讓不同的子類別可以實現相同的介面,但在呼叫這些介面的方法時會表現出不同的行為。這使得程式設計更具彈性和擴展性,避免了複雜的條件判斷式,同時促進了代碼的重用。 class Animal { makeSound() {
    ※ OPP第一大核心-封裝 封裝的精神在於將「方法」、「屬性」和「邏輯」包裝在類別裡面,透過類別的實例來實現。這樣外部物件不需要了解內部的實現細節,只需要知道如何使用該類別提供的接口即可。換句話說,封裝是將內部細節隱藏起來,只暴露必要的部分給使用者。 封裝的核心概念是,使用者如果想要接觸資料,只
    ※ class類別 什麼是class? class是創造consturctor function時的語法糖,本質上與使用function創造物件(object)的行為沒有不同。 class的作用: 用來定義、描述要創造的物件(object)具有那些屬性、行為的一個表達式。就像是「車子的設計圖
    ※ 模板字串(template literal): 使用「``」作為語法,作為字串拼接。 呈現多行內容。 const multiLineString = `This is a string that spans multiple lines.` console.log(multiLineStr
    ※ ES6 變數宣告介紹: 在ES6中,推薦使用let和const取代原有的var來宣告變數。 ※ var的特點: 勢力範圍(scope)只有兩種:function、global(全域部分)。 勢力範圍(scope)指的是宣告變數的範圍,能夠被有效的使用的範圍。 可以在宣告變數之前就使用。
    ※ 何謂Typescript? Typescript是Microsoft開發出來的一種JavaScript的擴展程式語言。 ※ 為什麼選擇 TypeScript? 靜態型別: 在執行程式碼之前就能避免許多錯誤。 幫助開發人員更快發現型別使用上的問題。 有效提升開發應用程式的效率。 輕鬆
    ※ OPP第三大核心-多型 ※ 多型的基本定義: 多型是利用繼承的特性,讓不同的子類別可以實現相同的介面,但在呼叫這些介面的方法時會表現出不同的行為。這使得程式設計更具彈性和擴展性,避免了複雜的條件判斷式,同時促進了代碼的重用。 class Animal { makeSound() {
    ※ OPP第一大核心-封裝 封裝的精神在於將「方法」、「屬性」和「邏輯」包裝在類別裡面,透過類別的實例來實現。這樣外部物件不需要了解內部的實現細節,只需要知道如何使用該類別提供的接口即可。換句話說,封裝是將內部細節隱藏起來,只暴露必要的部分給使用者。 封裝的核心概念是,使用者如果想要接觸資料,只
    ※ class類別 什麼是class? class是創造consturctor function時的語法糖,本質上與使用function創造物件(object)的行為沒有不同。 class的作用: 用來定義、描述要創造的物件(object)具有那些屬性、行為的一個表達式。就像是「車子的設計圖
    ※ 模板字串(template literal): 使用「``」作為語法,作為字串拼接。 呈現多行內容。 const multiLineString = `This is a string that spans multiple lines.` console.log(multiLineStr
    ※ ES6 變數宣告介紹: 在ES6中,推薦使用let和const取代原有的var來宣告變數。 ※ var的特點: 勢力範圍(scope)只有兩種:function、global(全域部分)。 勢力範圍(scope)指的是宣告變數的範圍,能夠被有效的使用的範圍。 可以在宣告變數之前就使用。
    你可能也想看
    Google News 追蹤
    Thumbnail
    在 TypeScript 中,套件是模組化代碼的集合,可以提高代碼的可重用性和可維護性。常見的套件包括各種庫和框架,如 lodash、express 等。以下是有關引用套件、自定義套件和常見套件的詳細介紹。
    Thumbnail
    本章節是一個初級的 TypeScript 教學,主要介紹了 TypeScript 中物件導向程式設計的各種核心概念,包括類別、建構子、存取修飾子、繼承、多型、封裝、介面、抽象類別、靜態類別、列舉、委派、Lambda 表達式、泛型和反射等。每個概念都通過詳細的解釋和實例代碼來進行深入的介紹。
    Thumbnail
    本章節旨在介紹TypeScript中的函數,包括其基本結構、如何呼叫函數、函數的參數以及函數的返回值等相關概念。通過本章節,讀者可以學習到如何在TypeScript中使用不同的方式來定義函數,如函數聲明、函數表達式、箭頭函數和匿名函數等。
    Thumbnail
    本章節旨在介紹 TypeScript 的基本資料型別,包括內建型別、型別轉換、自訂型別、元組、集合、陣列、和字典型別。透過理解和使用這些型別,可以提高代碼的可讀性和可維護性。
    Thumbnail
    本章節旨在介紹TypeScript的基本語法,包括一般結構、程式進入點、註解以及變數的定義和賦值。這些知識將幫助讀者瞭解TypeScript的基本架構,並且可以開始使用TypeScript進行開發。
    Thumbnail
    TypeScript是一種由Microsoft開發和維護的開源編程語言。它是JavaScript的超集,主要擴展了JavaScript的語法,增加了靜態類型檢查和其他特性,使得開發大型應用程序更為方便和可靠。
    Thumbnail
    在本章節中,我們將學習JavaScript的基本語法,包括如何註解代碼和如何聲明變數。瞭解這些基礎知識對於進一步學習和使用JavaScript來編寫代碼是非常重要的。
    Thumbnail
    針對 JavaScript 中的原始型別和隱性轉型進行了詳細的探討
    Thumbnail
    本文帶你深入探索 TypeScript 中的 satisfies 特性,能幫助你實現精確的型別推導與型別檢查。透過實際案例,展示如何使用 satisfies 提升代碼的型別安全與程式碼的整潔,是每位 TypeScript 開發者不可或缺的知識。
    Thumbnail
    上一篇文章分享了 TypeScript 的定義、前端角色定位,如果你不是很確定「TypeScript 是什麼?」、「TypeScript 作為 JavaScript 的超集,在網頁開發扮演怎麼樣的角色?」這兩個問題的答案,建議可以回到上一篇先了解一下。
    Thumbnail
    在 TypeScript 中,套件是模組化代碼的集合,可以提高代碼的可重用性和可維護性。常見的套件包括各種庫和框架,如 lodash、express 等。以下是有關引用套件、自定義套件和常見套件的詳細介紹。
    Thumbnail
    本章節是一個初級的 TypeScript 教學,主要介紹了 TypeScript 中物件導向程式設計的各種核心概念,包括類別、建構子、存取修飾子、繼承、多型、封裝、介面、抽象類別、靜態類別、列舉、委派、Lambda 表達式、泛型和反射等。每個概念都通過詳細的解釋和實例代碼來進行深入的介紹。
    Thumbnail
    本章節旨在介紹TypeScript中的函數,包括其基本結構、如何呼叫函數、函數的參數以及函數的返回值等相關概念。通過本章節,讀者可以學習到如何在TypeScript中使用不同的方式來定義函數,如函數聲明、函數表達式、箭頭函數和匿名函數等。
    Thumbnail
    本章節旨在介紹 TypeScript 的基本資料型別,包括內建型別、型別轉換、自訂型別、元組、集合、陣列、和字典型別。透過理解和使用這些型別,可以提高代碼的可讀性和可維護性。
    Thumbnail
    本章節旨在介紹TypeScript的基本語法,包括一般結構、程式進入點、註解以及變數的定義和賦值。這些知識將幫助讀者瞭解TypeScript的基本架構,並且可以開始使用TypeScript進行開發。
    Thumbnail
    TypeScript是一種由Microsoft開發和維護的開源編程語言。它是JavaScript的超集,主要擴展了JavaScript的語法,增加了靜態類型檢查和其他特性,使得開發大型應用程序更為方便和可靠。
    Thumbnail
    在本章節中,我們將學習JavaScript的基本語法,包括如何註解代碼和如何聲明變數。瞭解這些基礎知識對於進一步學習和使用JavaScript來編寫代碼是非常重要的。
    Thumbnail
    針對 JavaScript 中的原始型別和隱性轉型進行了詳細的探討
    Thumbnail
    本文帶你深入探索 TypeScript 中的 satisfies 特性,能幫助你實現精確的型別推導與型別檢查。透過實際案例,展示如何使用 satisfies 提升代碼的型別安全與程式碼的整潔,是每位 TypeScript 開發者不可或缺的知識。
    Thumbnail
    上一篇文章分享了 TypeScript 的定義、前端角色定位,如果你不是很確定「TypeScript 是什麼?」、「TypeScript 作為 JavaScript 的超集,在網頁開發扮演怎麼樣的角色?」這兩個問題的答案,建議可以回到上一篇先了解一下。