首页 > 语言 > JavaScript > 正文

TypeScript类型声明书写详解

2024-05-06 15:35:22
字体:
来源:转载
供稿:网友

本文总结一下TypeScript类型声明的书写,很多时候写TypeScript不是问题,写类型就特别纠结,我总结下,我在使用TypeScript中遇到的问题。如果你遇到类型声明不会写的时候,多看看lodash的声明,因为lodash对数据进行各种变形操作,所以你能遇到的,都有参考示例。

基本类型

 // 变量 const num: number = 1; const str: string = 'str'; const bool: boolean = true; const nulls: null = null; const undefine: undefined = undefined; const symbols: symbol = Symbol('symbal'); const any: any = 'any types'; // typescript的any类型,相当于什么类型约束都没有

数组

 // 数组: 推荐使用T[]这种写法 const nums: number[] = [1, 2, 3, 4]; // 不推荐:Array<T>泛型写法,因为在JSX中不兼容,所以为了统一都使用T[]这种类型 const strs: Array<string> = ['s', 't', 'r']; const dates: Date[] = [new Date(), new Date()];

数组的concat方法,返回类型为never[]问题

 // 数组concat方法的never问题 // 提示: Type 'string' is not assignable to type 'never'. const arrNever: string[] = [].concat(['s']); // 主要问题是:[]数组,ts无法根据上下文判断数组内部元素的类型 // @see https://github.com/Microsoft/TypeScript/issues/10479 const fixArrNever: string[] = ([] as string[]).concat(['s']);

接口

接口是 TypeScript 的一个核心知识,它能合并众多类型声明至一个类型声明:

而且接口可以用来声明:函数,类,对象等数据类型

interface Name { first: string; second: string;}let username: Name = { first: 'John', second: 'Doe'};

any、null、undefined、void类型

// 特殊类型const any: any = 'any types'; // typescript的any类型,相当于什么类型都没写let nobody: any = 'nobody, but you';nobody = 123;let nulls: number = null;let bool: boolean = undefined;// voidfunction printUsername (name: string): void {  console.log(name);}

联合类型

联合类型在option bags模式场景非常实用,使用 **| **来做标记

function options(opts: {  types?: string;  tag: string | number;}): void {  }

交叉类型

最典型的使用场景就是继承和mixin,或者copy等操作

// 交叉类型:如果以后遇到此种类型声明不会写,直接看Object.assign声明写法function $extend<T, U>(first: T, second: U): T & U { return Object.assign(first, second); // 示意而已}

元组 tuple

元组很少使用

let nameNumber: [string, number];// OknameNumber = ['Jenny', 221345];// Error// nameNumber = ['Jenny', '221345'];let tuple: [string, number];nameNumber = ['Jenny', 322134];const [usernameStr, uselessNum] = nameNumber;            
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选