安装Ts
TS是微软开发的编程语言,只是在js之上增加了类型的标注。并能在编写阶段检查错误
如果我们要执行ts编写的代码,需要先将它转译成js才行。这时就要用到大名鼎鼎的转译器TSC
// 安装于 2023.03.15
sudo npm i typescript -g // 安装ts
tsc -v // 查看版本 Version 4.9.5
tsc --init // 创建 tsconfig.json
tsc code.ts // 将 code.ts 转译成 code.js
Ts数据类型
- 数字 number
- 字符串 string
- 布尔 boolean
- 万能类型 any
- 如果一个函数没有返回值的时候 `tuString: () => void`
- 永不存在的值 never
- 数组泛型写法 `Array<number>` 或 `number[], string[], boolean[]`
- 当一个函数没有返回值的时候 `tuString: () => void`
- 对象数据类型 interface
普通变量注解
// 初始值的普通变量 不需要指定类型。 编辑器可以自己做类型推导
let count: number = 1
let str = '浓好'
str = 'smith'
let b: string = `hello is ${str}`
let arr1: (string | number)[] = [1, 2, '5']
let arr2: Array<number> = [1, 2, 5]
let arr3: any[] = [1, 2, '5'] // 干脆不写
// 元祖类型
let tuple: [number, string] = [1, 'is']
// 枚举数据类型 限制取值, 这里的 hungry 只能取值 '吃饭' 或者 '不吃饭'
let hungry: '吃饭' | '不吃饭'
let dice: 1 | 2 | 3 | 4 | 5 | 6
// 限制对象的类型 interface[定义接口], 首字母大写
interface User {
name: string;
id?: number;
readonly course: string; // 只读属性
// [prop: string]: any; // 其他没有注解的字段为任意类型
sayHi: () => string;
}
const user: User = {
name: '张三',
id: 77,
course: '物理',
sayHi: ():string => { return '嗨' }
}
user.course = '数学' // 上面定义了 readonly ,就不能在编辑了
// 将所有类型转换为可选属性
const user2: Partial<User> = {
name: '张三',
}
函数类型注解
/**
* 函数类型
* 给参数赋值类型、给返回值赋值类型
* ?: 代表这个参数是可选的
*/
function multiply(a: number, b?: number): number {
return a * b;
}
multiply(1, 2)
multiply(1)
// 如果一个函数没有返回值。标记为 void 类型
function sayHi(): void {
alert('嗨')
}
// 函数重载 每个参数有多个类型
// 类型别名, 用type 声明一个类型别名 赋值给参数和变量
type Foo = string | number | boolean
function withNever(foo: Foo) {
if (typeof foo === 'string') {
// ...
}
}
tsconfig.json配置文件
创建tsconfig.json文件,终端命令行执行,tsc --init
修改tsconfig.json中"strict"的值为false,禁用严格模式。
编写ts报错
VS Code运行项目报错:Type annotations can only be used in TypeScript files
类型注释只能在TypeScript文件中使用
解决:
文件>首选项>设置,中搜索 javascript.validate
, 把勾选去掉