前言
TypeScript学习笔记
TypeScript源代码文件由.ts
为后缀
TypeScript完全兼容Javascript,可以直接在.ts
文件中编写Javascript代码
下载TS编译器
1
| npm install typescript -g
|
使用TS编译器tsc
编译单个TS文件
编译后会在当前目录下生成对应文件名的.js
文件
默认编译成ES3的JS代码
<file>
:TS源代码文件
监视模式
- tsc编译器持续监视
<file>.ts
文件,一旦发生改变就立即编译
编译多个TS文件
创建配置文件
编译
监视模式
声名一个有类型的变量
数据类型
声名一个任意类型的变量
显式的
- any类型和unknown类型都可以存放任意类型的数据
- any和unknown的区别
- any类型的变量可以赋值给任意类型的变量,所以会污染有数据类型的变量,导致原本有数据类型的变量数据类型也变成了any
- unknown类型的变量不可以赋值给其他数据类型的变量,所以不会污染原本有数据类型的变量
强制将unknown类型的变量赋值给其他类型
- 通过
as 数据类型
进行类型断言,将unknown类型的数据赋值给其他类型
1 2 3
| let a unknown = "";
let b string = a as string;
|
1 2 3
| let a unknown = "";
let b string = <string>a;
|
隐式的
字符串类型
数值类型
布尔类型
对象类型
定义对象中包含的属性
- 这种变量只能存储拥有指定属性的对象
- 存储的对象必须且仅有指定属性名的属性,并且属性的数据类型必须与定义的相同
let a: {k: number};
a = {k: 0};
定义可选的属性
- 在属性名后添加
?
表示这个属性是可选的,无论有无这个属性,都能被这个变量存储
let a: {k?: number};
a = {};
定义任意类型的属性值
- 这个变量可以存储任意数量、任意名称的属性,属性值的类型只要符合any即可
propName
:这个名称是任意的
1
| let 变量名: {[propName: string]: any}
|
let a: {[k: string]: any};
a = {a: 0, b: true, c: ""};
函数类型
定义函数结构的类型声名
1
| let 变量名: (形参名: 数据类型)=>数据类型;
|
let a: (k: number)=>string;
a = function (0) {
return ""
};
数组类型
let a: number[];
a = [0];
let a: Array<number>;
a = [0];
元祖类型
- 这个元祖变量中只能存放指定长度、指定数据类型的数据
let a: [int, string];
a = [0, ""];
枚举类型
1 2 3 4
| enum 枚举名 { 枚举属性名 = 枚举属性值 枚举属性名 = 枚举属性值 }
|
// 定义枚举
enum Gender {
Male
Female
}
// 获取枚举值
Gender.Male
1 2 3 4
| enum 枚举名 { 枚举属性名 枚举属性名 }
|
联合类型
满足其一
- 这种类型的变量可以存放提及到的多种数据类型的其中一种
let a: 0 | 1;
a = 0;
同时满足
- 这种类型的变量只能存放满足所有提及到的多种数据类型
let a: {k1: number} & {k2: string};
a = {k1: 0, k2: ""};
定义一个有类型的变量
联合类型
1
| let 变量名: 数据类型 | 数据类型 = 值;
|
自动类型推倒
- 当定义一个变量时,如果省略了数据类型的定义,ts会自动将首次赋值的类型作为这个变量的数据类型
子面量类型声明
多个字面量
- 通过
|
定义或者关系
- 这种变量只能存放提及到的值的其中一个
定义一个对象类型的变量
1
| let 变量名: object = function () {};
|
在定义函数时添加类型声名
为形参添加类型声名
1 2 3
| function 函数名(形参名: 数据类型) { ... }
|
为返回值添加类型声名
1 2 3
| function 函数名(): 数据类型 { ... }
|
没有返回值
- 无返回值、返回值为
null
、返回值为undefined
都可以用void
定义
1 2 3
| function 函数名(): void { ... }
|
1 2 3 4
| function 函数名(): void { ... return null }
|
1 2 3 4
| function 函数名(): void { ... return undefined }
|
不允许有返回值
- 绝对没有返回值,不允许返回任何值,可以使用
never
定义
1 2 3
| function 函数名(): never { ... }
|
定义一种类型
type a = 0 | 1;
let b: a = 0;
type c = {
key: string
};
let d: c = {key: "value"};
完成
参考文献
哔哩哔哩——尚硅谷