typescript 补充

server/2024/11/13 8:11:59/

文章目录

    • Pick<T, K> 从 T 中挑选部分属性构成新类型
    • Partial<T>:将类型的所有属性变为可选
    • Required<T>:将类型的属性变为必选。
    • Omit<T, K>:从 T 中移除部分属性构成新类型。
    • Readonly<T>:将类型的属性设为只读。
    • Record<string | number | symbol,any>
    • 类型推断
    • 数组的不可变性 (ReadonlyArray)
    • 深度不可变 DeepReadonly

在这里插入图片描述

Pick<T, K> 从 T 中挑选部分属性构成新类型

typescript">interface Person {name: string;age: number;email?: string;
}type PickedPerson = Pick<Person, "name" | "age">; // { name: string; age: number }const person: PickedPerson = {age: 20,name: "Tom",
};

Partial:将类型的所有属性变为可选

typescript">interface IProps {name: string;age: number;sex: "男" | "女";job?: string;
}type Person2 = Partial<IProps>; // { name?: string; age?: number; sex?: "男" | "女"; job?: string }const person2: Person2 = {name: "Tom",sex: "男",
};

Required:将类型的属性变为必选。

typescript">interface IProps {name: string;age: number;sex: "男" | "女";job?: string;
}type Person3 = Required<IProps>; // { name: string; age: number; sex: "男" | "女"; job: string }const person3: Person3 = {name: "Tom",age: 20,sex: "男",job: "程序员",
};

Omit<T, K>:从 T 中移除部分属性构成新类型。

typescript">interface IProps {name: string;age: number;sex: "男" | "女";job?: string;
}type Person6 = Omit<IProps, "sex" | "name">; // { age: number; job?: string }const person6 : Person6 = {age: 20,job: "程序员",
}

Readonly:将类型的属性设为只读。

typescript">interface IProps {name: string;age: number;sex: "男" | "女";job?: string;
}type Person4 = Readonly<IProps>;const person4: Person4 = {name: "Tom",age: 20,sex: '男',
}// person4.name = "Jerry"; // 会报错,因为name是只读的

Record<string | number | symbol,any>

Record<string | number | symbol,any> 是一个类型工具,用于创建一个对象类型,其中键的类型可以选三种 ,值的类型可以任意规定

typescript">interface IProps {name: string;age: number;sex: "男" | "女";job?: string;
}type Person = Pick<IProps, "name" | "age">;const person5: Record<string, Person> = {Tom: {name: "Tom",age: 20,},Jerry: {name: "Jerry",age: 22,},
}

类型推断

ReturnType 是返回函数的返回值的类型
Parameters 是返回参数的类型

typescript">type Func = (x: number, y: string) => boolean;
type ReturnTypeOfFunc = ReturnType<Func>; // boolean
type ParametersOfFunc = Parameters<Func>; // [number, string]

数组的不可变性 (ReadonlyArray)

ReadonlyArray 是 readonly 在数组中的一种特例。与普通数组不同,ReadonlyArray 禁止使用会修改数组的方法(例如 push、pop 等),从而确保数组内容不会被改变。

typescript">const numbers: ReadonlyArray<number> = [1, 2, 3];// numbers.push(4); // 错误:ReadonlyArray 不允许修改数组内容

深度不可变 DeepReadonly

仅将嵌套对象设为不可变,而让顶层的普通属性保持可变状态

typescript">type DeepReadonly<T> = {[K in keyof T]: T[K] extends object ? Readonly<T[K]> : T[K];};interface PersonA {name: string;address: { city: string; zip: string };}const person7: DeepReadonly<PersonA> = {name: "Alice",address: { city: "New York", zip: "10001" },};person7.name = "Bob"; // person7.address.city = "Boston" // Error

在这里插入图片描述


http://www.ppmy.cn/server/140751.html

相关文章

基于IM场景下的Wasm初探:提升Web应用性能|得物技术

一、何为Wasm &#xff1f; Wasm&#xff0c;全称 WebAssembly&#xff0c;官网描述是一种用于基于堆栈的虚拟机的二进制指令格式。Wasm被设计为一个可移植的目标&#xff0c;用于编译C/C/Rust等高级语言&#xff0c;支持在Web上部署客户端和服务器应用程序。 Wasm 的开发者参…

NAT网络工作原理和NAT类型

NAT基本工作流程 通常情况下&#xff0c;某个局域网中&#xff0c;只有路由器的ip是公网的&#xff0c;局域网中的设备都是内网ip&#xff0c;内网ip不具备直接与外部应用通信的能力。 处于内网的设备如何借助NAT来实现访问外网的应用&#xff1f; 对于开启了NAT功能的局域网…

Spring Boot实现多数据源连接和切换

文章目录 前言一、多数据源配置与切换方案二、实现步骤1. 创建多个 DataSource 配置类2. 创建 DataSource 配置类3. 创建动态数据源路由类4. 实现 DynamicDataSource 类5. 创建 DataSourceContextHolder 来存储当前的数据源标识6. AOP 方式切换数据源7. 自定义注解来指定数据源…

Apache POI 操作Word常用方法

系列文章目录 一、Java使用Apache POI导出excel 二、Apache POI 操作Excel常用方法 三、Apache poi 拆分单元格并赋值 四、使用easypoi模板方法导出excel 五、Apache poi给excel单元格添加下拉框或数据验证 六、Apache poi操作Word常用方法 文章目录 系列文章目录一、介绍二、…

M芯片Mac构建Dockerfile - 注意事项

由于MacBook的M芯片架构与intel不同&#xff0c;交叉构建Linux服务器docker镜像&#xff0c;需要以下步骤完成&#xff1a; 编写好Dockerfile在命令行中&#xff0c;执行构建命令&#xff1a; docker buildx build --platform linux/amd64 -t ${image_name}:${tag} .

机器视觉基础—双目相机

机器视觉基础—双目相机与立体视觉 双目相机概念与测量原理 我们多视几何的基础就在于是需要不同的相机拍摄的同一个物体的视场是由重合的区域的。通过下面的这种几何模型的目的是要得到估计物体的长度&#xff0c;或者说是离这个相机的距离。&#xff08;深度信息&#xff09…

JAVA基础:单元测试;注解;枚举;网络编程 (学习笔记)

单元测试 操作步骤&#xff1a; a.导包import org.junit; b.三个注解 Test Before After c.点击Test 运行就可以了 用在不需要控制台输入的情境下&#xff1a;javaweb&#xff0c;框架项目&#xff0c;微服务项目 供开发人员自己做测试。 package com.page…

【微服务】不同微服务之间用户信息的获取和传递方案

如何才能在每个微服务中都拿到用户信息&#xff1f;如何在微服务之间传递用户信息&#xff1f; 文章目录 概述利用微服务网关做登录校验网关转微服务获取用户信息openFeign传递微服务之间的用户信息 概述 要在每个微服务中获取用户信息&#xff0c;可以采用以下几种方法&#…