TypeScript 安裝

更新於 發佈於 閱讀時間約 3 分鐘

# 安裝

npm install -g typescript

# 編譯

使用框架如 NextJS 時,框架會自動執行 TS 編譯

tsc hello.ts

# Hello TypeScript

  • 範例:
    function sayHello(person: string) {
    return 'Hello, ' + person;
    }

    let user = 'Tom';
    console.log(sayHello(user));
  • 上述例子中,使用 : 指定 person type 為 string
  • 運行會自動產生編譯好的文件 hello.js
    tsc hello.ts
  • 編譯好的
    function sayHello(person) {
    return 'Hello, ' + person;
    }
    var user = 'Tom';
    console.log(sayHello(user));
  • 編譯完成的文件,就是純粹 JS,因為 TS 只會在編譯過程中檢查,運行中不會檢查
  • 如果要執行中檢查,還是要手動檢查
    function sayHello(person: string) {
    if (typeof person === 'string') {
    return 'Hello, ' + person;
    } else {
    throw new Error('person is not a string');
    }
    }

    let user = 'Tom';
    console.log(sayHello(user));
  • 編譯錯誤預設依然會產生 JS 檔案,例如以下錯誤的範例
    function sayHello(person: string) {
    return 'Hello, ' + person;
    }

    let user = [0, 1, 2];
    console.log(sayHello(user));
  • 依然會產出
    function sayHello(person) {
    return 'Hello, ' + person;
    }
    var user = [0, 1, 2];
    console.log(sayHello(user));
  • 若想要編譯錯誤時不產出,可在 tsconfig.json 中定義 noEmitOnError

# 參考

留言
avatar-img
留言分享你的想法!
avatar-img
Learn or Die
0會員
16內容數
分享程式技術
Learn or Die的其他內容
2025/05/14
在 Next.js 中有四種方法可以在 routes 之間導航: 使用 <Link> component 使用 useRouter hook(用於 Client Components) 使用 redirect 函數(用於 Server Components) 使用原生的 History AP
Thumbnail
2025/05/14
在 Next.js 中有四種方法可以在 routes 之間導航: 使用 <Link> component 使用 useRouter hook(用於 Client Components) 使用 redirect 函數(用於 Server Components) 使用原生的 History AP
Thumbnail
2025/05/05
# Community Starter Kit Support in laravel new 12.2 Laravel new command,新增支援 community starter kit,支援的清單可 參考 laravel new --using statamic/statamic m
2025/05/05
# Community Starter Kit Support in laravel new 12.2 Laravel new command,新增支援 community starter kit,支援的清單可 參考 laravel new --using statamic/statamic m
2025/04/30
# 建立 Routes Next.js 使用基於檔案系統的路由器,資料夾用來定義 routes。 每個資料夾代表一個 route segment,對應到一個 URL segment。 要建立 nested routes,可以將資料夾彼此巢狀。 使用特殊的 page.js 檔案來讓 rou
Thumbnail
2025/04/30
# 建立 Routes Next.js 使用基於檔案系統的路由器,資料夾用來定義 routes。 每個資料夾代表一個 route segment,對應到一個 URL segment。 要建立 nested routes,可以將資料夾彼此巢狀。 使用特殊的 page.js 檔案來讓 rou
Thumbnail
看更多
你可能也想看
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
在 TypeScript 中,套件是模組化代碼的集合,可以提高代碼的可重用性和可維護性。常見的套件包括各種庫和框架,如 lodash、express 等。以下是有關引用套件、自定義套件和常見套件的詳細介紹。
Thumbnail
在 TypeScript 中,套件是模組化代碼的集合,可以提高代碼的可重用性和可維護性。常見的套件包括各種庫和框架,如 lodash、express 等。以下是有關引用套件、自定義套件和常見套件的詳細介紹。
Thumbnail
本章節旨在介紹TypeScript中的函數,包括其基本結構、如何呼叫函數、函數的參數以及函數的返回值等相關概念。通過本章節,讀者可以學習到如何在TypeScript中使用不同的方式來定義函數,如函數聲明、函數表達式、箭頭函數和匿名函數等。
Thumbnail
本章節旨在介紹TypeScript中的函數,包括其基本結構、如何呼叫函數、函數的參數以及函數的返回值等相關概念。通過本章節,讀者可以學習到如何在TypeScript中使用不同的方式來定義函數,如函數聲明、函數表達式、箭頭函數和匿名函數等。
Thumbnail
本章節旨在介紹 TypeScript 的基本資料型別,包括內建型別、型別轉換、自訂型別、元組、集合、陣列、和字典型別。透過理解和使用這些型別,可以提高代碼的可讀性和可維護性。
Thumbnail
本章節旨在介紹 TypeScript 的基本資料型別,包括內建型別、型別轉換、自訂型別、元組、集合、陣列、和字典型別。透過理解和使用這些型別,可以提高代碼的可讀性和可維護性。
Thumbnail
本章節將引導你如何建立一個TypeScript開發環境,這包括安裝Node.js、npm和TypeScript,建立一個TypeScript項目,設置編輯器,以及編寫和編譯TypeScript代碼。在完成這些步驟之後,你將能夠編寫、編譯和運行TypeScript代碼。
Thumbnail
本章節將引導你如何建立一個TypeScript開發環境,這包括安裝Node.js、npm和TypeScript,建立一個TypeScript項目,設置編輯器,以及編寫和編譯TypeScript代碼。在完成這些步驟之後,你將能夠編寫、編譯和運行TypeScript代碼。
Thumbnail
本章節旨在介紹TypeScript的基本語法,包括一般結構、程式進入點、註解以及變數的定義和賦值。這些知識將幫助讀者瞭解TypeScript的基本架構,並且可以開始使用TypeScript進行開發。
Thumbnail
本章節旨在介紹TypeScript的基本語法,包括一般結構、程式進入點、註解以及變數的定義和賦值。這些知識將幫助讀者瞭解TypeScript的基本架構,並且可以開始使用TypeScript進行開發。
Thumbnail
TypeScript是一種由Microsoft開發和維護的開源編程語言。它是JavaScript的超集,主要擴展了JavaScript的語法,增加了靜態類型檢查和其他特性,使得開發大型應用程序更為方便和可靠。
Thumbnail
TypeScript是一種由Microsoft開發和維護的開源編程語言。它是JavaScript的超集,主要擴展了JavaScript的語法,增加了靜態類型檢查和其他特性,使得開發大型應用程序更為方便和可靠。
Thumbnail
因為最近想嘗試編碼風格,於是就選了一套比較"不嚴格"的輔助工具來摸索。 編輯器 VS CODE 框架 VUE3 打包工具 VITE 編碼風格 Standard 環境 version { "nodejs":"v18.18.0", "npm":"9.8.1" }
Thumbnail
因為最近想嘗試編碼風格,於是就選了一套比較"不嚴格"的輔助工具來摸索。 編輯器 VS CODE 框架 VUE3 打包工具 VITE 編碼風格 Standard 環境 version { "nodejs":"v18.18.0", "npm":"9.8.1" }
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News