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

泛型工具类型和操作符

前言

 TypeScript 内置了一些常用的工具类型。

  • Partial
  • Required
  • Omit
  • Pick
  • ....

操作符

       typeof

        typeof 操作符可以用来获取一个变量声明或对象的类型

const p = {x:2,y:'cm'}
let g:typeof p = {x:3,y:'ff'}

        这里g需要满足:

  •  有x属性且值是number类型
  •  有y属性且值是string类型

        再来看个应用的例子:

function toArray(x: number): number[] {return [x];
}
type Func = typeof toArray; 

        此时通过写轮眼typeof复制过来的Func类型是这样的:

         (x: number) => number[]

         我们把这个Func类型用起来

function myFn(cb: Func) :void {cb()
}

        这样是会报错的,为什么,因为Func传入number类型参数,返回一个数字数组,所以我们要:

function myFn(cb: Func) :void {cb(3)
}

        

        keyof

        keyof 操作符可以用来一个对象中的所有 key 值:

interface Person {name: string;age: number;
}type K1 = keyof Person; // "name" | "age"

       如果是数组,则返回:

type K2 = keyof Person[]; // "length" | "toString" | "pop" | "push" | "concat" | "join" 

        注意这里只能用type类型变量而不是普通变量。

        

         这个操作符看起来有啥用呢?来看这个例子:

type dataObj = {name:string,score: number
}
type typeKey = keyof dataObj;

        我们把objType直接拿来用:

        再来看个例子:

        用ts定义一个获取对象属性值的方法

        要获取对象的属性值,必须传入对象和属性名

function xxx(obj,key) {}

        约束传参,obj必须是对象类型,key必须是obj的键名

function xxx<T extends object, K extends keyof T> (obj: T, key: K) {}

        书写函数体:

function xxx<T extends object, K extends keyof T> (obj: T, key: K) { return obj[key] } 

         完整代码:


function getValue<T extends object, K extends keyof T> (obj: T, key: K) {return obj[key]
}const obj = {name: 'test',age: 18
}getValue(obj, 'name')
getValue(obj, 'age')

 

        in遍历

        in 用来遍历枚举类型:

type xxx = 'name' | 'age'
type Obj = {[key in xxx]: any
}

        extend

        有时候我们定义的泛型不想过于灵活或者说想继承某些类等,可以通过 extends 关键字添加泛型约束。

interface aaa {length: number;
}function xxx<T extends aaa>(arg: T): T {console.log(arg.length);return arg;
}

        

工具类型

        Partial

       在使用时可以将任意类型作为参数传递给它,然后返回一个新的类型,该类型包含了原类型中的所有属性,但所有属性都变成了可选的。

interface User {name: string;age: number;email: string;
}

        使用 Partial<User> 可以生成以下的类型:

{name?: string | undefined;age?: number | undefined;email?: string | undefined;
}

        看一个完整的例子:

interface Todo {title: string;description: string;}function updateTodo(todo: Todo, newTodo: Partial<Todo>) {return { ...todo, ...newTodo };
}const todo2 = updateTodo({title:'杂志',description:'这是一个本杂志'}, {description: "我没有标题",
});

        Required

        Required将类型中所有选项变为必选,去除所有?

interface Contact{name?: string; // 姓名phone?: string; // 手机号
}
function dbb (axx:Required<Contact>){console.log(axx)}
dbb({name:'11',phone:'132'})

        直接赋值给新的type也行

type newContact = Required<Contact>
let hgd :newContact = {name:'33'}

         Pick

         可以从一个对象类型中 取出某些属性

        语法: Pick<对象类型,属性1 | 属性2,  ....>

interface User {account: stringavatar: stringid: stringmobile: stringtoken: string
}type customUser = Pick<User,'id'|'token'|'mobile'>
// 结果:PickUserTest === {id: string,token: string, mobile:string}

        

        Omit 

         Omit 可以从一个对象类型中 排除某些属性

        语法:Omit<对象类型,属性1 | 属性2,  ....>

type customUser2= Omit<User,'id'|'token'|'mobile'>
let xxx:customUser2 = { account: 'agggg',avatar:'png'}

http://www.lryc.cn/news/165518.html

相关文章:

  • idea中启动maven项目报错-java: 程序包lombok.extern.slf4j不存在问题如何解决
  • MyBatis-动态SQL
  • Swift学习内容精选(二)
  • 类欧笔记存档
  • 电能计量远程抄表系统的分析及在物业的应用
  • 计算机网络篇之端口
  • GO语言篇之发布开源软件包
  • Eclipse官网下载历史版本
  • SCI常见词汇表达
  • 使用ref如何获取到input标签中的值
  • 自定义Dynamics 365实施和发布业务解决方案 3. 开箱即用自定义
  • python-pytorch 关于torch.load()和torch.load_state_dict()
  • 关于批量安装多个apk
  • 【案例教学】华为云API对话机器人的魅力—体验AI垃圾分类机器人
  • go基础详解2-go run test
  • 【NVIDIA CUDA】2023 CUDA夏令营编程模型(三)
  • 字节8年经验之谈 —— 冒烟测试、回归测试是什么?
  • FP6102 20V、3A降压开关调节器芯片
  • 魔众携手ModStart上线全新模块市场,支持模板主题
  • 织梦CMS_V5.7任意用户密码重置漏洞复现
  • ESP32通过ali的C LINK4.0接入aliyun阿里云
  • Spring中使用了哪些设计模式
  • matlab 13折线法数据量化编码与解码
  • Yolov8小目标检测-添加模块改进-实验记录
  • 2023国家网络安全宣传周|邮件安全意识培训-钓鱼篇
  • 【Leetcode】140.单词拆分II(Hard)
  • 【数据结构-堆】堆
  • Ansible 自动化运维工具部署主从数据库+读写分离
  • 蓝桥杯官网填空题(星期几)
  • 《向量数据库指南》——向量数据库会是 AI 的“iPhone 时刻”吗?