2018-05-09 5分钟入门CTS-尝鲜中文版TypeScript
程序员文章站
2022-04-15 16:49:38
"知乎原链" 本文为 "中文代码示例之5分钟入门TypeScript" 的 "CTS" 版本. CTS作者是@htwx(github). 它实现了关键词和标准库的所有命名汉化. 本文并未使用附带的vscode相关插件(包括CTS语言插件和拼音输入插件), 与原Typescript教程类似, 只用了命 ......
本文为中文代码示例之5分钟入门typescript的cts版本. cts作者是@htwx(github). 它实现了关键词和标准库的所有命名汉化. 本文并未使用附带的vscode相关插件(包括cts语言插件和拼音输入插件), 与原typescript教程类似, 只用了命令行进行编译.
过程仍旧基于typescript官方文档: typescript in 5 minutes.
源码在:
第一个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中打开显示正确:
吃了么, 大黄
下一篇： 设计模式第七篇-适配器模式