typescript常用工具类型

typescript Awaited<Type>教程用法 Awaited就是模仿这种行为,递归解包获取其中的类型。但这样真的好吗,很多请求或者异步操作返回值可能都是不固定,当然,除非你定死它返回的必须是string类型。首先看一下官方的说明:这种类型旨在模拟函数await中的操作async,或 s.then()上的方法——特别是它们递归解包Promise的方式。在 Awaited 还没出来之前,一般使用这种方法获取异步操作返回值的类型。ts4.5发布了Awaited,但是很多人不明白Awaited的用法。,如果是则取出其中的类型,如果不是,则直接返回。 阅读详情
/**
 * Recursively unwraps the "awaited type" of a type. Non-promise "thenables" should resolve to `never`. This emulates the behavior of `await`.
 * 递归去解包 await 的值
 */
type Awaited<T> =
    T extends null | undefined ? T : // special case for `null | undefined` when not in `--strictNullChecks` mode
        T extends object & { then(onfulfilled: infer F, ...args: infer _): any } ? // `await` only unwraps object types with a callable `then`. Non-object types are not unwrapped
            F extends ((value: infer V, ...args: infer _) => any) ? // if the argument to `then` is callable, extracts the first argument
                Awaited<V> : // recursively unwrap the value
                never : // the argument to `then` was not callable
        T; // non-object or non-thenable

interface ArrayLike<T> {
    readonly length: number;
    readonly [n: number]: T;
}

/**
 * Make all properties in T optional
 * 所有T类型的属性,转为可选
 */
type Partial<T> = {
    [P in keyof T]?: T[P];
};

/**
 * Make all properties in T required
 * 所有T类型的属性,转为必选
 */
type Required<T> = {
    [P in keyof T]-?: T[P];
};

/**
 * Make all properties in T readonly
 * 所有T类型的属性,转为readonly
 */
type Readonly<T> = {
    readonly [P in keyof T]: T[P];
};

/**
 * From T, pick a set of properties whose keys are in the union K
 * 在一个类型中,获取某些字段,生成一个新类型
 * interface User {  
    uid : number;         // 用户ID  
    username : string;    // 用户名  
    password : string;    // 密码  
    email : string;       // 邮箱  
    residence : string;   // 居住地  
    job : string;         // 职业  
    sex : number;         // 性别  
    birthday : string;    // 生日
    }
    type RegisterArgs = Pick<User, 'username' | 'email' | 'password'>

    得到:
    interface RegisterArgs {  
        username : User['username'];  
        email : User['email'];  
        password : User['password'];
    }
    参考自:https://zhuanlan.zhihu.com/p/522017893
 */
type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};

/**
 * Construct a type with a set of properties K of type T
 * 参考自:https://blog.youkuaiyun.com/weixin_38080573/article/details/92838045
 */
type Record<K extends keyof any, T> = {
    [P in K]: T;
};

/**
 * Exclude from T those types that are assignable to U
 * 从T中剔除可以赋值给U的类型。
 * type T00 = Exclude<"a" | "b" | "c" | "d", "a" | "c" | "f">;  // "b" | "d"
 */
type Exclude<T, U> = T extends U ? never : T;

/**
 * Extract from T those types that are assignable to U
 * 提取T中可以赋值给U的类型。
 * type T01 = Extract<"a" | "b" | "c" | "d", "a" | "c" | "f">;  // "a" | "c"
 */
type Extract<T, U> = T extends U ? T : never;

/**
 * Construct a type with the properties of T except for those in type K.
 * 生成一个类型,排除掉给定类型中的某个字段
 * // 除了uid是必须的,其他都可以省略 
    interface UpdateUserArgs {  
        uid : User['uid']  
        username? : User['username'];  
        email? : User['email'];  
        residence? : User['residence'];  
        job? : User['job'];  
        sex? : User['sex'];  
        birthday? : User['birthday']
    }
    type UpdateUserArgs = Pick<User, 'uid'> & Partial<Omit<User, 'uid'>>
    选择User中的uid,确保其必填,然后让除了uid以外的所有字段可选填
    参考自:https://zhuanlan.zhihu.com/p/522017893
 */
type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

/**
 * Exclude null and undefined from T
 * 给定类型排除掉null undefined
 */
type NonNullable<T> = T & {};

/**
 * Obtain the parameters of a function type in a tuple
 * 获取函数的参数类型
 * function test(a:string,b:number) {
        return {
            a,b
        }
    }
    type testtype = Parameters<typeof test>
    // type testtype = [a: string, b: number]

    // 获取的是 类型值
    type testtype1 = Parameters<typeof test>[1]
    // type testtype1 = number
    参考地址:https://blog.youkuaiyun.com/m0_52518047/article/details/127833927
 */
type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;

/**
 * Obtain the parameters of a constructor function type in a tuple
 */
type ConstructorParameters<T extends abstract new (...args: any) => any> = T extends abstract new (...args: infer P) => any ? P : never;

/**
 * Obtain the return type of a function type
 * 获取函数的返回值类型关键词:ReturnType
 * interface typeb {
        name: string,
        age: number,
    }
    let person:typeb = {
        name:'xiaoming',
        age:12
    }

    function test(person:typeb) {
        return person
    }
    type testtype2 = ReturnType<typeof test>
    // type testtype2 = typeb
    参考地址:https://blog.youkuaiyun.com/m0_52518047/article/details/127833927
 */
type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any;

/**
 * Obtain the return type of a constructor function type
 */
type InstanceType<T extends abstract new (...args: any) => any> = T extends abstract new (...args: any) => infer R ? R : any;

/**
 * Convert string literal type to uppercase
 */
type Uppercase<S extends string> = intrinsic;

/**
 * Convert string literal type to lowercase
 */
type Lowercase<S extends string> = intrinsic;

/**
 * Convert first character of string literal type to uppercase
 */
type Capitalize<S extends string> = intrinsic;

/**
 * Convert first character of string literal type to lowercase
 */
type Uncapitalize<S extends string> = intrinsic;

/**
 * Marker for contextual 'this' type
 */
interface ThisType<T> { }

/**
 * Represents a raw buffer of binary data, which is used to store data for the
 * different typed arrays. ArrayBuffers cannot be read from or written to directly,
 * but can be passed to a typed array or DataView Object to interpret the raw
 * buffer as needed.
 */

TypeScript infer 实战:手把手教你从数组里‘抠’出想要的类型(附4个常用工具类型源码) 本文深入解析TypeScript中`infer`关键字的高阶用法,通过四个实战场景演示如何从数组类型中精准提取元素类型。从基础的首尾元素提取到模拟数组的shift/pop操作,结合Redux、表单流程等实际案例,帮助开发者掌握类型安全的进阶技巧,提升代码可维护性。 阅读详情

相关推荐

网课、网页视频倍速播放简单脚本

一个简单的网页视频倍速脚本

huazn612的博客 1万+

【lib.es5】ArrayBuffer、DataView 的TypeScript接口

ArrayBuffer、DataView 的 TypeScript 接口 邮箱 :291148484@163.com 优快云 主页:https://blog.youkuaiyun.com/qq_28550263?spm=1001.2101.3001.5343 本文地址:https://blog.youkuaiyun.com/qq_28550263/article/details/123169738 目 录 1. ArrayBuffer 1.1 语法 1.1.1 返回值 1.1.2 异常 1.2 描述 1.2.1

jclee95的个人博客 1985

地理空间智能体(GI Agent)

地理空间智能体(Geospatial Intelligence Agent, GI Agent)是AI Agent技术与地理信息系统(GIS)深度融合的产物。其核心是以大型语言模型(LLM)为驱动,通过自然语言理解、任务分解和工具调用能力,实现地理空间任务的自动化执行。​关键特性​自主性​:独立规划任务流程(如空间数据检索、分析、可视化);​交互性​:支持自然语言对话交互,替代传统图形界面操作;​扩展性​:灵活集成第三方工具和API,支持跨平台协作。

百态·数智思维 | 聚焦大数据、量化与未来AI 2033

JavaScript处理二进制数据:TypedArrays

翻译自:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays 随 着Web应用的发展,越来越多地需要使用JavaScript来处理视频、音频,或者通过WebSocks获取原始数据。很显然,我们需要有一种方法能够 方便快捷地地用JavaScript处理原始二进制数据。过去,我们将原始数据作为字符串来对待,并使...

weixin_34296641的博客 410

innovus中path group 的策略和应用(上)

在所有的后端工具里边,有三个重要的引擎:auto-place,CTS,auto-route三个。这里边的auto-place是决断了整个设计时序的基点。。当然,就算是到了CTS/route阶段后,也可以继续利用auto-place数据优化的功能,在数据库上做数据路径增量优化(optDesign -increment)。可以说,数据路径的优化手段,实际上是贯穿在整个后端流程上的。。看看这其中的奥妙和有趣的事情。ICer GO!

i_chip_backend的博客 4218

无人机航拍实战:如何用Python代码精准计算目标地理坐标(附完整代码)

本文详细介绍了如何利用Python代码实现无人机航拍图像中目标点的精准地理位置计算。通过解析从像素坐标系到WGS84大地坐标系的完整转换链条,结合相机内参、无人机姿态与地球曲率处理,提供了可直接运行的实战代码,并重点分析了地理位置计算中的常见误差来源与应对策略,助力开发者解决实际项目中的定位漂移问题。

hh234的博客 357

typescript超全入门基础语法详解,及配置文件详解

TypeScript 是微软开发的JavaScript的超集,typescript兼容JavaScript,可以载入JavaScript代码然后运行。

老衲爱洗头的博客 525

手把手教你用FPGA实现SGMII接口:从IP核配置到板级调试全流程

本文详细介绍了如何在Xilinx 7系列FPGA上实现SGMII(Serial Gigabit Media Independent Interface)接口的全流程,包括IP核配置、约束编写和硬件调试。通过具体的硬件选型建议、软件工具链配置和PCB设计规范,帮助开发者快速构建稳定可靠的千兆通信链路,并提供了常见故障排查和性能优化技巧。

weixin_29194693的博客 296

LaravelShoppingcart实战案例:构建完整的电商购物流程

LaravelShoppingcart是一个专为Laravel框架设计的简单购物车实现,它提供了完整的购物车管理功能,帮助开发者快速构建电商网站的购物流程。本文将通过实战案例,展示如何使用LaravelShoppingcart构建从商品添加到订单结算的完整购物体验。 ## 快速安装与配置 要开始使用LaravelShoppingcart,首先需要通过Composer安装依赖包。在你的Larav

gitblog_01093的博客 347

电脑技巧:Hyper-V安装UOS操作系统图文教程

今天给大家分享微软官方Hyper-v虚拟机管理软件安装UOS操作系统图文教程,感兴趣的朋友也可以下载试一试,当然有啥问题也可以互相沟通交流!

IT技术分享社区 4707

注意力机制与经典 CV 网络:PyTorch 实现与实战

注意力机制(SE/空间/CBAM/Non-Local)通过权重重标定让模型聚焦关键特征,经典 CNN(ResNet/DenseNet/FPN)提供了深层网络、特征复用和多尺度融合的基础骨架。建议先在 ResNet 上插入 SE 模块(通道注意力)做基线实验,再根据任务类型引入空间注意力(分割任务)或非局部注意力(视频任务)。CIFAR-10 数据集适合快速验证注意力模块的有效性,迁移到更大数据集时保持相同的结构设计思路即可。

FJN110的博客 62

typescript索引类型_TypeScript的索引类型与映射类型,以及常用工具泛型的实现

相信现在很多小伙伴都在使用 TypeScript(以下简称 TS),在 TS 中除了一些常用的基本类型外,还有一些稍微高级一点的类型,这些就是我本次文章要讲的内容:索引类型与映射类型,希望小伙伴们看过这篇文章后能对 TS 有更深一步的理解。索引类型下面我通过一个官方的例子来说明下什么是索引类型:function pluck(o, names) { return names.map((n...

weixin_39667801的博客 216

android 蓝牙通讯demo

android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。

TypeScript常用工具类型(Utility Types)

TypeScript提供了很多工具类型,供使用者方便的从一个类型转换到另一个类型。下面介绍几种常用的工具类型和使用场景,以便更好的应用TypeScript校验,减少我们代码出错的机率。

2301_77345366的博客 701

Camera2Demo

在Camera2 的基础上进行封装,使得Camera2一堆初始化逻辑与Activity分离,降低耦合度,完成预览拍照并保存的操作

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

TypeScript的索引类型与映射类型,以及常用工具泛型的实现

相信现在很多小伙伴都在使用 TypeScript(以下简称 TS),在 TS 中除了一些常用的基本类型外,还有一些稍微高级一点的类型,这些就是我本次文章要讲的内容:索引类型与映射类型,希...

web前端开发 380

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

typescript常用工具类型Pick,Omit,Partial

的属性键),剩余属性组成新的类型。),通常用于 “部分更新” 场景。的所有属性变为可选属性(添加。的属性键),组成新的类型。中,挑选出指定的属性。

xiao1215fei的专栏 253

BFE-TS TypeScript类型体操练习 Easy 31-40

题目来自TypeScript题目 | BFE.dev - 前端刷题,准备前端面试拿到心仪的Offer,总共60题,带你完爆类型体操!

泯泷的博客 776

Typescript 常用工具类型 Partial、Required、Readonly、Record、Pick、Omit

Typescript 常用工具类型 Partial、Required、Readonly、Record、Pick、Omit

前端kk的博客 1046

Typescript中常用的工具类型及用法

TypeScript 提供了一些非常实用的,可以帮助我们简化类型定义和提高代码的可读性。这些工具类型主要是用来对现有类型进行一些变换,比如设置某些属性为可选、只读,或者从类型中排除某些属性等等。

xiaowu5705的博客 661

TypeScript infer实战:手把手教你从数组里‘抠’出想要的类型(附4个常用工具类型源码)

本文深入探讨了TypeScript中`infer`关键字的高级用法,通过四大核心技法展示如何从复杂类型中精准提取所需部分。从基础数组操作到嵌套结构处理,文章提供了4个实用工具类型的源码实现,帮助开发者提升类型编程能力,实现更安全的代码设计。

weixin_31421613的博客 314

Typescript中的Required,Partial,Pick,Omit辅助类型

4.使用Pick只保留指定属性允许使用,这里只保留name和age允许使用。5.使用Omit将指定属性抽离出来,只允许未抽离的可使用。3.使用Partial将属性从必填转为非必填。2.使用Required将属性转为必填。以上定义的类型里面的属性都是非必填。

qq_41429765的博客 496

11. TypeScript 工具类型

TypeScript内置的工具类型(Utility Types)提供了一种高效的方式来变换和操作现有类型。常见工具类型包括:Partial将属性设为可选,Required设为必填,Readonly设为只读;Pick选择特定属性,Record创建键值对象类型;Exclude从联合类型中移除部分元素。这些工具类型能提升代码复用性、可读性和维护性,适用于表单处理、API数据转换等场景。合理组合使用这些工具类型,可使类型定义更精简高效,是TS开发的重要技能。

Raink老师的博客 962

ts泛型,映射,条件类型和类型提取infer和一些常用工具库的说明

ts泛型,映射,条件类型和类型提取infer和一些常用工具库的说明

动感超人的博客 3007

彻底搞懂typescript工具类型及其原理

前言 相信很多人都在学习typescript,这里介绍泛型常见的工具类型函数(Utility Types)及其在typescript中的源码实现。 工具函数 可能有些刚开始学ts的还不清楚什么工具类型指的是什么,工具类型就是TypeScript提供的一些实用类型来实现常见的类型转换,这些类型是全局可用的,所有的类型定义在typescript源码中也都能找到。 Partial Partial<T>,将传入T类型的所有属性设为可选属性。 例如下面的实例代码,定义一个user接口类型,通过Partia

qq_32438227的博客 1022

TypeScript 工具类型

TypeScript工具类型是提高开发效率和代码质量的强大工具,主要包括Partial(属性可选)、Required(属性必填)、Readonly(属性只读)、Pick(选取属性)、Omit(排除属性)、Exclude/Extract(联合类型操作)、NonNullable(排除空值)、ReturnType/Parameters(函数类型操作)、Record(键值映射)和ThisType(this类型指定)等。这些工具类型能减少重复代码、提高类型安全性、增强可读性并提升开发效率,通过示例展示了各种工具类型的

xiangxiongfly 467

TypeScript实用技巧

1. is关键字 is关键字可用来判断并限定值的类型,比如: function user0(name: any): name is string { return name === 'lili' } function user1(name: any): boolean { return name === 'lili' } function getUserName(name: string...

木槿花开 832
上一篇: web前端问题总结
下一篇: 前端性能监控
xiaolu289
博客等级 码龄19年 8粉丝 21原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值