#TypeScript
#1. 基础类型
- 在JavaScript中,Number、String等称之为对应类型的包装类,而string、number等则是TypeScript给我们定义的标识符,提供的对应的基本类型。
TS的基础类型
let foo: number = 0;
let bar: string = "";
let baz: boolean = false;
/* 数组类型 - 两种写法 */
const arr1: string[] = ["abc", "cba"];
const arr2: Array<number> = [1, 2, 3];
/* 函数的类型 */
/* 返回值可以省略,推自动类型推导,复杂的情况需要自己手动配置 */
function sum(num1: number, num2: number): number {
return num1 + num2;
}
/* 元组类型 */
/* 元组数据结构中可以存放不同的数据类型,取出来的item也是有明确的类型 */
const info: [string, number, number] = ["Mio", 16, 1.58];
/* 在函数中使用元组类型也是最多的(函数的返回值) */
function useState(initalState: number): [number, (newValue: number) => void] {
let stateValue = initalState;
function setValue(newValue: number) {
stateValue = newValue;
}
return [stateValue, setValue];
}- TypeScript的类型推导
TS的类型推导
/*
let进行类型推导,推导出来的是通用类型
const进行类型推导,推导出来的则是字面量类型
*/
let foo = 0;
let bar = true;
const baz = "Mio";匿名的参数类型
- 匿名函数是否需要添加类型注解呢?最好不要添加类型注解
匿名函数
const names = ["abc", "cba", "mba"];
names.forEach(function (item, index, arr) {
console.log(item, index, arr);
});对象类型的使用
对象类型
const obj: {name: string, age?: number} {
name: 'Mio'
}
```
```typescript title="对象类型"
type PointType = {
x: number;
y: number;
z?: number;
};
function printCoordinate(point: PointType) {
console.log("X坐标:", point.x);
console.log("Y坐标:", point.y);
}
printCoordinate({ x: 20, y: 30 });
export {};函数类型的定义
函数类型的定义
type FooType = () => void;
const foo: FooType = () => {};never类型
never使用
/*
封装框架/工具库的时候可以使用以下never
其他时候在扩展工具的时候,对于一些没有处理的case,可以直接报错
*/
function handleMessage(message: string | number | boolean) {
switch (typeof message) {
case "string":
console.log(message.length);
break;
case "number":
console.log(message);
break;
case "boolean":
console.log(Number(message));
break;
default:
const check: never = message;
}
}
