ts进阶

作者: 看到这朵小fa了么 | 来源:发表于2020-10-27 15:55 被阅读0次

发现看完了文档还是不会写,别人写的代码又看不懂,找了篇文档看:https://blog.csdn.net/weixin_39843414/article/details/105108806
总结一下:

interface和type

  • 都是类型的声明,不同点在于,type除了支持Object,function,class外还支持其他的类型,type不能同名,也就意味着不能进行聚合,继承需要重新定义type,type还支持复杂的类型操作,当然,interface和type并不互斥,都可以互相继承,语法上type是用&继承,interface用=继承
  • 注意类和接口都被视为静态蓝图,因此,他们不能实现/继承 联合类型的 type,implements关键字用于类和接口表示对接口的继承和实现
// type可以表示更多类型,可以使用计算
type Name = string;
 
type PartialPointX = {x:number;};
type PartialPointY = {y:number;};
 
type PartialPoint = PartialPointX | PartialPointY;
 
type Data = [number,string,boolean];

// type继承interface
interface particalPerson {name: 'liming'}
type person = name & {age: 18}
// interface继承 type
type particalPerson = {name: 'liming'}
interface person extends particalPerson {age: 18}

// implements
interface Point {x: number, y:number}
class somePoint implements Point {x: 1, y: 2}
//error 联合类型无法被类实现
type Point2 = {x: number} | {y:number}
class somePoint2 implement Points {x: 1, y:2}

extends

  • 扩展,继承,可以对已有的类型进行扩展,也可以对类型进行条件的限定,判断是否继承于某个接口
type isEuqalType<A, B> = A extends B ? (B extends A ? true : false) : false

typeof

  • 注意与js中的语法是不一样的 重复的关键字名称
  • typeof 引用类型操作符,将任何可以在编译时确定的变量的类型,转化为可以在类型系统中的类型
    假设T是一个类型,那么typeof T 将得到类型的联合类型的表示
interface Izip {name: '', age: 12, class: 1}
type ant = typeof Izip // ant=name | age | calss

泛型

  • 泛型就是不预先确定数据类型,而是在使用时再确定的一种类型约束规范。
  • 传入函数时的泛型可以理解为函数的参数,代表类型而不是代表值
  • 可以通过extends进行类型的约束,示例代码:
function plunk<T, K extends typeof T>(o: T, name: K[]): T[K][] {
  return name.map(n =>o(n))
}
interface Point = {name: string, age: number}
let person: Point = {name: 'liming', age: 10}
let result: string[] = plunk(person, ['name', 'name', 'name']) // 输出 ['liming', 'liming', 'liming']
  • 传入类型的定义,K为T的类型的联合表示,name为K的数组
  • 返回值的类型,是由T的内部的类型的值组成的数组

工具函数

  • infer 在extends条件语句中表示待推断的类型变量
  • Partial 将选入的属性变为可选项
type Partial<T> = <P in  keyof T?: T[P]>
  • Required 将传入的属性变成必选项
type Required<T> = <P in keyof T-?: T[P]>
  • Readonly 将传入的属性变为可读的
type Readonly<T> = <readonly [P in keyof T]: T[P]>
  • Record<T, K> 将传入的K的属性的值都赋值为T
type Record<K extends keyof any, T> = {<P in K: T>}
  • Extract<T, K> 将T中的K的属性都获取出来
type Extract<T, K> =< T extends K?T : never>
  • Exclude<T, K> 将T中的K的属性都剔除出去
type Exclude<T, K> = <T extends K? never: T>
  • Pick<T, K> 将T中的K的属性和值都获取出来
type Pick<T, K extends keyof T> = {P in K: T[P]}
  • Omit<T, K> 将T中的K的属性值都剔除出去
type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>

相关文章

  • ts进阶

    发现看完了文档还是不会写,别人写的代码又看不懂,找了篇文档看:https://blog.csdn.net/weix...

  • ts进阶 - 摘录

    infer 表示待推断类型 如果T能赋值给(...args: infer P) => any, 结果是(...ar...

  • TS进阶知识

    一:TypeScript的配置文件: https://blog.csdn.net/weixin_46221198/...

  • TS进阶之keyof

    刷完了type-challenges[https://github.com/type-challenges/typ...

  • TS进阶之infer

    前一篇文章我们有介绍条件类型,这篇文章我们来介绍下非常实用的infer的使用方法。 使用介绍 我们上篇文章中介绍了...

  • TS泛型进阶

    拿下泛型,TS 还有什么难的吗? 大家好,我是沐华,本文将剖析 TS 开发中常见工具类型的源码实现及使用方式,并且...

  • TS进阶(四)类型保护

    类型保护是为了更加精确的知道类型 typeof保护 可以使用typeof用来确定类型,那么参数就可以使用确定类型的...

  • TS进阶(一)装饰器

    装饰器 在一些场景我们需要额外的特性来支持标注或者修改类及其成员的时候,装饰器为我们在类及其远程通过元编译语法添加...

  • TS进阶之条件类型

    前端开发者对Javascript中的三元表达式应该都很熟悉,利用三元表达式可以很方便实现根据输入值得到不同的输出结...

  • Ts 进阶使用指南

    # Ts 使用指南 ## 6、参数类型和返回类型 ```ts // 参数类型和返回类型 function crea...

网友评论

      本文标题:ts进阶

      本文链接:https://www.haomeiwen.com/subject/azitvktx.html