TypeScript 5分钟上手开发闭坑篇持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第15天

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第15天，点击查看活动详情

包装类型

首字母大写也就是class java里面包装类型相当于是模板，原始类型就相当于是模板造出来的东西。

原始类型可以赋值给模板实例，反过来不行。

let num: number;
let Num: Number;
Num = num; // ok
num = Num; // ts(2322)报错

其实很容易理解

let num = new Number()
num = 12

Object 包装类型，是所有数据类型的基类

Object 与 object

never

值永远不会存在任何类型都不能赋值，只有never类型可以赋值给never类型

function err(msg: string): never {
    throw new Error(msg)
}

当然上面例子中void也是满足的

实际上never类型应用可以让我们写出非常安装代码

实际开发中经常定义type 然后根据type实现逻辑

type TabType = '100' | '200' ;

function tabClicked(type: TabType){
    if (type === '100') {
        
    }else  if (type === '100') {

    } else {
        const check: never = type;
    }
    
}

下次新增type 的时候没有写对应的逻辑代码或者写漏了地方会直接报错

type TabType = '100' | '200' | '300' ;

unknown

ts 3.0引进了unknown类型 unknown 任何类型的值都可以赋值给它，但它只能赋值给unknown和any any赋值和取值都可以当做任意类型

unknown类型要使用对应包装类型实现的方法，必须使用typeof或者as后才能用

let x: unknown = 'aBdc'
// 直接使用
const upName = x.toLowerCase(); // Error
// typeof
if (typeof x === 'string') {
    const upName = x.toLowerCase(); // OK
}
// 类型断言 
const upName2 = (x as string).toLowerCase(); // OK

类型断言

as 确定为某个类型，as笃定

!非空断言

let name: null | undefined | string;
name!.toString(); // ok
name.toString(); // ts(2531)

name类型不确定！可以排除不含toString方法的其他类型

有时候ts无法判断是否已经赋值了，这时候我们可以用确定赋值断言

let name!: string;

##字面量类型。

ts中有三种字面量类型。也就是值可以被定义为一种类型，既是类型又是值。

interface Config {
    size: 'small' | 'big'; // 值small既是类型又是值
    isEnable:  true | false;
    margin: 0 | 2 | 4;
}

交叉类型

& 就是并集

  type IntersectionType = { id: number; name: string; } & { age: number };

上述代码相当于


  type IntersectionType = { id: number; name: string, age: number }

注意坑

 type IntersectionType = { id: number; name: string; } & { name: number };
最终name将是never类型

type IntersectionType = { id: 2; name: string; } & { id: number };
最终id将是 2 类型 只能赋值2不能其他值

interface 绕考类型检查方式

鸭式辨型法

interface TestType {
label: string;
}
function printLabel(test: TestType) {
console.log(test.label);
}
let myObj = { size: 10, label: "testtest" };
printLabel(myObj); // OK

as

let myObj: TestType = { size: 10, label: "testtest" } as TestType

接口多次定义，会被自动合并为所有接口

interface Point { x: number; }
interface Point { y: number; }
const point: Point = { x: 1, y: 2 };

TypeScript 5分钟上手开发 闭坑篇