1.TS 初识
1、微软开发的一款开源的编程语言
2、是JavaScript的超集,遵循最新的ES6、ES5规范。typescript扩展了JavaScript的语法
3、本质上添加了可选的静态类型和基于类的面向对象编程,通俗的理解为JavaScript的一个特殊版本,其语法规范严谨,适用于开发大型项目应用
4、谷歌也在大力支持typescript的推广,谷歌的angular2.x就是基于typescript
5、最新的vue、react也集成typescript
6、nodeJS框架的Nextjs、midway中用的就是typescript
2.ts 开发环境搭建及自动编译
1、全局安装,
npm i typescript -g
2、运行ts,之后会把ts文件编译为js文件
tsc demo.ts
3、自动编译配置及运行
① tsc --init,创建tsconfig.json文件
② 在tsconfig.json中,加入 "outDir": "./js",
③ tsc -p tsconfig.json --watch;自动编译生效
3.对象类型
// 创建一个对象,包括以下属性,类型为IBytedancer
// I表示自定义的一个类型(一个命名约定),与类和对象进行区分
const bytedancer: IBytedancer = {
jobId: 9303245,
name: 'Lin',
sex: 'man',
age: 28,
hobby: 'swimming',
}
// 定义一个类型为IBytedancer
interface IBytedancer {
/* 只读属性readonly:约束属性不可在对象初始化外赋值 */
readonly jobId: number;
name: string;
sex: 'man' | 'woman' | 'other';
age: number;
/* 可选属性:定义该属性可以不存在 */
hobby?: string;
/* 任意属性:约束所有对象属性都必须是该属性的子类型 */
[key: string]: any; // any 任何类型
}
/* 报错:无法分配到"jobId",因为它是只读属性 */
bytedancer. jobId = 12345;
/* 成功:任意属性标注下可以添加任意属性 */
bytedancer .plateform = 'data';
/* 报错:缺少属性"name", 而hobby可缺省 */
const bytedancer2: IBytedancer = {
jobId: 89757,
sex: " woman ',
age: 18,
}
4.函数类型
function add(x, y!)
{ return x + y; } const mult = (x, y) => x * y;