当前位置: 首页 > 科技观察

秒懂TypeScript通用工具类型!_0

时间:2023-03-19 10:21:16 科技观察

如果你刚接触TypeScript,在阅读TypeScript内置工具类型的用法和内部实现时,你可能会看到Pick工具类型,你可能会对这种类型的语法感到陌生。typePick={[PinK]:T[P];};typeUser={id:number;名称:字符串;地址:字符串;};类型PickedUser=Pick;事实上,学习新事物更好的方法是使用类比。接下来阿宝哥将通过JavaScript中的函数,帮助大家快速理解Pick工具类型背后的语法。函数Pick(obj,keys){constret={};for(constkeyofkeys){ret[key]=obj[key];}returnret;}constuser={id:666,姓名:"阿宝哥",地址:"厦门",};constPickedUser=MyPick(user,["id","name"]);上面代码中,function是用来声明函数的关键字,Pick是函数名,small中括号中的obj和keys是参数,大括号中定义了函数体。对于Pick工具类型,使用type关键字为类型起一个别名以便于重用,Pick就是类型的名称。尖括号中的T和K是类型参数。与JavaScript函数中参数的区别在于类型参数存储类型,而JavaScript函数参数存储值。其中extends是泛型约束的语法,用于约束类型的范围。花括号中是实用程序类型的具体实现,它使用TypeScript映射类型的语法。事实上,你可以把TypeScript内置的工具类型看作是一些特殊的函数,用来处理TypeScript中存在的类型。调用工具类型与调用JavaScript函数不同的是使用尖括号。最后为了方便大家理解,阿宝哥以图片的形式演示了Pick工具类型的执行过程。如果想深入了解映射类型,可以看《使用TS映射类型,同行直呼高手!》这篇文章。