当前位置：首页 > news >正文

TS知识补充第一篇 ✅

news 来源：原创 2025/6/16 6:08:50

一、any、unknow和never

any

any类型表示一个值可以是任何类型。通常在不确定变量的类型，或者想要绕过TypeScript的类型检查的时候使用。但是使用any会导致类型安全的缺失，因为此时TypeScript不知道你在干什么，并且不会对类型为any的变量做任何类型检查。
滥用any的话会让TypeScript变成AnyScript，使得TS的使用没有意义。

unknow

unknown类型表示一个值可以是任何类型，但是你不能对它进行任何操作，直到你确定了它的具体类型。unknow就像更安全的any，因为必须进行类型检查或者类型断言后才能使用这些值。

let value: unknown = 10;
value.toString(); // Code爆红：类型“unknown”上不存在属性“toString”。ts(2339)
(value as number).toString(); // Success
(value as string).toLocaleLowerCase(); // Success
if (typeof value === "number") {
  value.toString(); // Success
}
if (typeof value === "string") {
  value.toLocaleLowerCase();
}

never

never类型表示那些永远不会发生的值的类型。它通常用于表示函数永远不会返回的情况（例如，函数内部总是抛出错误或进入无限循环）。
~~暂时还不知道有啥用嘿嘿。~~

二、TS函数重载

JavaScript是没有函数重载的，但是TypeScript有。

function add(a: string, b: string): string;
function add(a: number, b: number): number;

function add(a: any, b: any) {
  if (typeof a === "string" && typeof b === "string") {
    return a.concat(b);
  }
  if (typeof a === "number" && typeof b === "number") {
    return a + b;
  }
}

编译成JS后的代码也很简单：

function add(a, b) {
    if (typeof a === "string" && typeof b === "string") {
        return a.concat(b);
    }
    if (typeof a === "number" && typeof b === "number") {
        return a + b;
    }
}

三、typeof和keyof

在TypeScript中，typeof可以用作类型查询运算符。当你将typeof应用于一个变量时，它会返回该变量的类型。例如：

const example = { name: "Alice", age: 30 };
type Person = typeof example;
const person: Person = {
  name: "Bob",
  age: 25,
  gender: "male", // 对象字面量只能指定已知属性，并且“gender”不在类型“{ name: string; age: number; }”中。ts(2353)
};

keyof用于获取类型中所有公共属性的联合类型。它通常与typeof一起使用，以从对象类型中提取键值。例如：

type PersonKeys = keyof Person; // "name" | "age"
const nameKey: PersonKeys = "name"; // Success

结合这两个运算符，可以在TypeScript中构建非常精确的类型系统。例如之前在实习的时候遇到过这样的需求：

const dictMap = {
  college: "system_college",
  semester: "system_semester",
  courseProperty: "system_course_property",
} as const; // as const是必要的

// 需求（1）：定义一个类型Dict，属性key的值只能取自dicMap的values，属性value的值为string
// 需求（2）：dictMap在后续版本中可能改变，所以Dict的属性不能写死
interface Dict {
  key: (typeof dictMap)[keyof typeof dictMap];
  value: string
}

// 用法
const collegeDict: Dict = {
  key: dictMap.college,
  value: "College of Engineering"
}

四、TS的条件类型

在TS中可以根据条件从两种类型中选择一种类型。

type SpecialType<T> = T extends number ? bigint : string;
const bigNumber: SpecialType<number> = BigInt(10);
const stringValue: SpecialType<string> = "hello";

五、TS的声明合并

在 TypeScript 中，声明合并是指编译器会自动合并多个相同名称的类型声明为一个单一的声明。这种合并机制允许你从不同的地方定义类型、接口或命名空间，并将它们合并为一个整体，从而提供更灵活和强大的类型系统。
TypeScript 支持以下几种声明的合并：接口合并、命名空间合并、枚举合并。以接口合并为例：

interface Box {
  height: number;
  width: number;
}

interface Box {
  scale: number;
}

// 合并后的 Box 接口:
// interface Box {
//   height: number;
//   width: number;
//   scale: number;
// }

写在最后：为啥开这个专栏，纯粹是因为今天面试字节的时候，面试官问：JS和TS哪个用的多？我装杯：包是TS的🕶️。结果就是被拷打的无地自容，然后才意识到自己对TS的学习只停留在很浅薄的类型检测上。
所以这篇文章（这个专栏）持续更新，后续待补充的：枚举值、泛型、高级类型、装饰器、模块、命名空间、映射类型、工具类型。先吃宵夜去了😋。