TS介绍
javascript TypeScript 是添加了类型系统的 JavaScript,适用于任何规模的项目。 TypeScript
可以和 JavaScript 共存,这意味着 JavaScript 项目能够渐进式的迁移到 TypeScript。
1. Boolean 类型
let flag: boolean = true;
2. Number类型
let num: number = 123;
3. String 类型
let str: string = "hello world";
4. Array类型
let arr: Array<string> = []; // 第一种写法 react.jsx
let arr1: string[] = ['a','b','c']; // 第二种写法 推荐
arr1.push('x'); // arr1 = ['a','b','c','x']
// arr1.push(1); // error typeof 1: number !== string
5. Symbol 类型
let name1: symbol = Symbol('name')
let name2: symbol = Symbol('name')
const obj = {
[name1]: 'hello world',
[name2]: '你好 呆瓜'
}
6. Null / Undefined 类型
let n: null = null;
let u: undefined = undefined;
7. Object 类型
let obj: object = {
msg: 'hello world',
num: 18
}
8. Enum 类型
枚举 enum 讲一组可能出现的值,
使用枚举我们可以定义一些带名字的常量。
使用枚举可以清晰地表达意图或创建一组有区别的用例。
TypeScript 支持数字的和基于字符串的枚举。
- 数字枚举
enum Direction {
NORTH, // NORTH = 0,
SOUTH, // SOUTH = 1
EAST, // EAST = 2
WEST, // WEST = 3
}
let dir: Direction = Direction.NORTH;
// 枚举之反向映射
let dirName = Direction[0]; // NORTH
let dirVal = Direction["NORTH"]; // 0
默认情况下 NORTH 的值为0,其他成员自动增长。
设置默认值
enum Direction {
NORTH = 5, // NORTH = 5,
SOUTH, // SOUTH = 6
EAST, // EAST = 7
WEST, // WEST = 8
}
- 字符串枚举
enum Direction {
NORTH = "NORTH",
SOUTH = "SOUTH",
EAST = "EAST",
WEST = "WEST",
}
- 常量枚举
const enum Direction {
NORTH,
SOUTH,
EAST,
WEST,
}
let dir: Direction = Direction.NORTH;
- 异构枚举
异构枚举的成员值是数字和字符串的混合。
enum Enum {
A, // 0
B, // 1
C = "C",
D = "D",
E = 8,
F, // 9
}
console.log(Enum.A) //输出:0
console.log(Enum[0]) // 输出:A
9. Any 类型
let isAny: any = 666;
isAny = "str"; // ok
isAny = false; // ok
isAny = []; // ok
isAny = null; // ok
// 使用场景:第三方库有些库没写过类型注解
10. Unknown 类型
unknown 类型只能被赋值给 any 类型和 unknown 类型本身
只有能够保存任意类型值的容器才能保存 unknown 类型的值。
不能赋值给其他类型的变量
// 和any类型类似
let value: unknown;
value = Math.random; // OK
value = new TypeError(); // OK
value = Symbol("u"); // OK
let value1: unknown = value; // OK
let value2: any = value; // OK
11. Tuple 类型
数组一般都是由同一种类型组成;
但有时我们需要在单个变量中存储不同类型的值,这就是元组;
let tupleType: [string, number, boolean];
tupleType = ['str', 666, true];
// error
tupleType = [true, "str"];
// Type 'true' is not assignable to type 'string'.
// Type 'semlinker' is not assignable to type 'number'.
12. Void 类型
Void 类型和 Any 类型相反,他表示没有任何类型。
当一个函数没有返回值的时候,就需要使用 Void 类型。
function fn(): void {
console.log('666')
}
// 函数名 + 括号 + ( : void ) ==> 代表函数的返回值
"use strict";
let voidType: void = undefined;
13. Never 类型
never 类型表示的是那些永不存在的值的类型。
never 类型是那些总会爆出异常或根本不会有返回值的函数的返回值类型。
function error(): never {
throw new Error('handle error')
}
function while(): never {
while(true) {
console.log(1)
}
}
// 类型别名
type Foo = string | number;
function seeNever(msg: Foo) {
if (typeof msg === "string") {
// 这里 msg 为 string 类型
} else if (typeof msg === "number") {
// 这里 msg 为 number 类型
} else {
// msg 在这里是 never
const foo: never = msg;
}
}
seeNever('str')
seeNever(666)