"知乎原鏈" 本文為 "中文代碼示例之5分鐘入門TypeScript" 的 "CTS" 版本. CTS作者是@htwx(github). 它實現了關鍵詞和標準庫的所有命名漢化. 本文並未使用附帶的vscode相關插件(包括CTS語言插件和拼音輸入插件), 與原Typescript教程類似, 只用了命 ...
本文為中文代碼示例之5分鐘入門TypeScript的CTS版本. CTS作者是@htwx(github). 它實現了關鍵詞和標準庫的所有命名漢化. 本文並未使用附帶的vscode相關插件(包括CTS語言插件和拼音輸入插件), 與原Typescript教程類似, 只用了命令行進行編譯.
過程仍舊基於Typescript官方文檔: TypeScript in 5 minutes.
源碼在: program-in-chinese/cts_in_5_min
第一個CTS程式
函數 問好(那誰) {
返回 "吃了麽, " + 那誰;
}
變數 路人 = "打醬油的";
文檔.體.內部HTML = 問好(路人);運行
cts 問好.ts --useUnicodeKeywords編譯生成"問好.js"文件.
添加參數類型
函數 問好(那誰: 文字) {
返回 "吃了麽, " + 那誰;
}如果'那誰'的類型不符, 比如是數組類型[0,1,2], 編譯時會報錯, 挺好:
問好.ts(7,30): error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'string'.添加介面
介面 人 {
姓: 文字;
名: 文字;
}
函數 問好(那誰: 人) {
返回 "吃了麽, " + 那誰.姓 + 那誰.名;
}
變數 路人 = {姓: "大", 名: "黃"};這裡路人的"形狀"符合"人", 類型就被判定為相符.
自己誤寫成了:
函數 問好(那誰: 人) {
返回 "吃了麽, " + 人.姓 + 人.名;
}編譯提示'人'是個類型而不是值, 挺好:
問好.ts(7,20): error TS2693: '人' only refers to a type, but is being used as a value here.添加類
類別 學生 {
全名: 文字;
構造(公開 姓: 文字, 公開 名: 文字) {
本體.全名 = 姓 + 名;
}
}
介面 人 {
姓: 文字;
名: 文字;
}
函數 問好(那誰: 人) {
返回 "吃了麽, " + 那誰.姓 + 那誰.名;
}
變數 路人 = 新建 學生("大", "黃");運行第一個網路應用
為了檢驗js文件, 添加HTML文件:
<!DOCTYPE html>
<html>
<head><title>TypeScript你好</title></head>
<body>
<script src="問好.js"></script>
</body>
</html>html文件在Chrome中打開顯示正確:
吃了麽, 大黃
