TypeScript 線上演練場

此 TypeScript Playground 讓您無需開啟完整專案即可快速測試程式片段。它在您的瀏覽器中執行 TypeScript 編譯器，顯示附行號的型別檢查診斷資訊，輸出 JavaScript，並可在沙箱主控台中執行簡單輸出。

此 TypeScript Playground 的功能

此工具是為日常 TypeScript 檢查而設計的：驗證聯合型別縮小、測試泛型輔助型別、比較編譯器目標、確認 strict 模式行為，以及檢視 TypeScript 輸出的 JavaScript。它適用於學習、除錯精簡範例、準備解答，或在將小型重構移入專案前進行檢查。

如何使用 TypeScript 編譯器

1. 將 TypeScript 貼到編輯器中，或選擇一個快速範例。
2. 選擇 JavaScript 目標與模組格式。
3. 若您想要更嚴格的診斷，請啟用 strict 模式與選用的索引存取檢查。
4. 點擊編譯並進行型別檢查，或保持自動編譯啟用以取得即時回饋。
5. 檢視診斷資訊、檢查輸出的 JavaScript，然後在沙箱主控台中執行簡單的程式片段。

型別檢查注意事項

瀏覽器編譯器對常見的 JavaScript 物件（如陣列、字串、記錄、JSON、console 及計時器）使用精簡的內建宣告檔案。這讓 playground 在處理程式片段時保持快速且自給自足。如果您的程式碼依賴 React、Node.js、DOM API 或特定套件的宣告，請在您的專案中使用實際的 tsconfig.json 與已安裝的型別套件來確認最終結果。

範例與使用情境

當您想從較大的程式碼庫中隔離型別錯誤、比較 strict 模式如何改變診斷、向團隊成員解釋 TypeScript 概念，或檢視小型程式片段如何編譯為 JavaScript 時，請使用此 playground。內建範例涵蓋可區別聯合、泛型記錄輔助函式、satisfies 運算子以及刻意的型別錯誤，讓您可以同時看到正常與失敗的編譯器狀態。

• 在將聯合型別加入 API 回應模型之前先進行驗證。
• 測試泛型輔助函式，無需等待完整應用程式的建置。
• 在變更目標或模組選項時檢查輸出的 JavaScript。
• 分享 TypeScript 診斷的精簡重現。

常見問題

此工具會檢查 TypeScript 型別嗎？

會。它會在瀏覽器中建置 TypeScript 程式，並回報來自編譯器的診斷資訊，包括型別錯誤、語法錯誤以及編譯器選項訊息。

我可以變更 TypeScript 編譯器選項嗎？

可以。主要控制項涵蓋 JavaScript 目標、模組輸出、strict 模式、宣告檔輸出以及 noUncheckedIndexedAccess。

為什麼缺少某個函式庫的型別？

此 playground 刻意使用精簡的內建型別函式庫。對於框架、DOM、Node.js 或 npm 套件的型別，請使用您本機的專案設定。

JavaScript 執行器安全嗎？

此執行器在快速程式片段時使用沙箱化的 iframe。請避免執行不受信任的程式碼，並在您一般的開發環境中測試真實的應用程式碼。