TypeScript 类型体操姿势合集


English | 简体中文 | 日本語 | 한국어


## 介绍

众所周知，TypeScript 拥有一个图灵完备的类型系统

高质量的类型可以提高项目的可维护性并避免一些潜在的漏洞。市面上也已经有许多优秀的类型工具库，像是 [ts-toolbelt](https://github.com/millsp/ts-toolbelt), [utility-types](https://github.com/piotrwitek/utility-types), [SimplyTyped](https://github.com/andnp/SimplyTyped) 等等。我们也从这些项目中获取了许多灵感。 本项目意在于让你更好的了解 TS 的类型系统，编写你自己的类型工具，或者只是单纯的享受挑战的乐趣！我们同时希望可以建立一个社区，在这里你可以提出你在实际环境中遇到的问题，或者帮助他人解答疑惑 - 这些问题也可能被选中成为题库的一部分！ ## 题库 > 点击下方按钮查看题目内容 > **注**: 题目在[严格模式](https://www.typescriptlang.org/tsconfig#strict)下测试。
1
13・Hello World

13
4・实现 Pick 7・对象属性只读 11・元组转换为对象 14・第一个元素 18・获取元组长度 43・实现 Exclude 189・Awaited 268・If 533・Concat 898・Includes 3057・Push 3060・Unshift 3312・Parameters

97
2・获取函数返回类型 3・实现 Omit 8・对象部分属性只读 9・对象属性只读（递归） 10・元组转合集 12・可串联构造器 15・最后一个元素 16・排除最后一项 20・Promise.all 62・查找类型 106・去除左侧空白 108・去除两端空白字符 110・Capitalize 116・Replace 119・ReplaceAll 191・追加参数 296・Permutation 298・Length of String 459・Flatten 527・Append to object 529・Absolute 531・String to Union 599・Merge 612・KebabCase 645・Diff 949・AnyOf 1042・IsNever 1097・IsUnion 1130・ReplaceKeys 1367・Remove Index Signature 1978・Percentage Parser 2070・Drop Char 2257・MinusOne 2595・PickByType 2688・StartsWith 2693・EndsWith 2757・PartialByKeys 2759・RequiredByKeys 2793・Mutable 2852・OmitByType 2946・ObjectEntries 3062・Shift 3188・Tuple to Nested Object 3192・Reverse 3196・Flip Arguments 3243・FlattenDepth 3326・BEM style string 3376・InorderTraversal 4179・Flip 4182・斐波那契序列 4260・AllCombinations 4425・Greater Than 4471・Zip 4484・IsTuple 4499・Chunk 4518・Fill 4803・Trim Right 5117・去除数组指定元素 5140・Trunc 5153・IndexOf 5310・Join 5317・LastIndexOf 5360・Unique 5821・MapTypes 7544・Construct Tuple 8640・Number Range 8767・Combination 8987・Subsequence 9142・CheckRepeatedChars 9286・FirstUniqueCharIndex 9616・Parse URL Params 9896・获取数组的中间元素 9898・找出目标数组中只出现过一次的元素 9989・统计数组中的元素个数 10969・整数 16259・将类型为字面类型（标签类型）的属性，转换为基本类型。 17973・DeepMutable 18142・All 18220・Filter 21104・FindAll 21106・组合键类型 Combination key type 21220・Permutations of Tuple 25170・Replace First 25270・Transpose 26401・JSON Schema to TypeScript 27133・Square 27152・Triangular number 27862・CartesianProduct 27932・MergeAll 27958・CheckRepeatedTuple 28333・Public Type 29650・ExtractToObject 29785・Deep Omit 30301・IsOdd 30430・Tower of hanoi 30958・Pascal's triangle 30970・IsFixedStringLiteralType

52
6・简单的 Vue 类型 17・柯里化 1 55・联合类型转化为交叉类型 57・获得必需的属性 59・获得可选属性 89・必需的键 90・可选类型的键 112・Capitalize Words 114・CamelCase 147・C-printf Parser 213・Vue Basic Props 223・IsAny 270・Typed Get 300・String to Number 399・Tuple Filter 472・Tuple to Enum Object 545・printf 553・Deep object to unique 651・Length of String 2 730・Union to Tuple 847・String Join 956・DeepPick 1290・Pinia 1383・Camelize 2059・Drop String 2822・Split 2828・ClassPublicKeys 2857・IsRequiredKey 2949・ObjectFromEntries 4037・IsPalindrome 5181・Mutable Keys 5423・Intersection 6141・Binary to Decimal 7258・Object Key Paths 8804・两数之和 9155・ValidDate 9160・Assign 9384・Maximum 9775・Capitalize Nest Object Keys 13580・Replace Union 14080・FizzBuzz 14188・Run-length encoding 15260・Tree path array 19458・SnakeCase 25747・IsNegativeNumber 28143・OptionalUndefined 30178・Unique Items 30575・BitwiseXOR 31797・Sudoku 31824・Length of String 3 32427・Unbox 32532・Binary Addition

16
5・获取只读属性 151・Query String Parser 216・Slice 274・Integers Comparator 462・柯里化 2 476・Sum 517・Multiply 697・Tag 734・Inclusive Range 741・Sort 869・DistributeUnions 925・Assert Array Index 6228・JSON Parser 7561・Subtract 31447・CountReversePairs 31997・Parameter Intersection
按标签
#JSON26401・JSON Schema to TypeScript
#application12・可串联构造器 8767・Combination 6・简单的 Vue 类型 213・Vue Basic Props 30178・Unique Items
#arguments191・追加参数 3196・Flip Arguments
#array14・第一个元素 533・Concat 898・Includes 3057・Push 3060・Unshift 15・最后一个元素 16・排除最后一项 20・Promise.all 459・Flatten 949・AnyOf 3062・Shift 3243・FlattenDepth 4425・Greater Than 5153・IndexOf 5310・Join 5317・LastIndexOf 5360・Unique 8767・Combination 18142・All 18220・Filter 25270・Transpose 27133・Square 27152・Triangular number 27932・MergeAll 30430・Tower of hanoi 30958・Pascal's triangle 17・柯里化 1 2822・Split 5423・Intersection 8804・两数之和 9160・Assign 9384・Maximum 9775・Capitalize Nest Object Keys 14080・FizzBuzz 31797・Sudoku 32427・Unbox 32532・Binary Addition 216・Slice 734・Inclusive Range 741・Sort 925・Assert Array Index 31997・Parameter Intersection
#built-in4・实现 Pick 7・对象属性只读 43・实现 Exclude 189・Awaited 3312・Parameters 2・获取函数返回类型 3・实现 Omit
#cif30178・Unique Items
#conditional type21220・Permutations of Tuple
#deep9・对象属性只读（递归） 17973・DeepMutable 553・Deep object to unique 956・DeepPick
#filter18220・Filter
#function32427・Unbox
#game31797・Sudoku
#infer3312・Parameters 2・获取函数返回类型 10・元组转合集 2070・Drop Char 4260・AllCombinations 9616・Parse URL Params 55・联合类型转化为交叉类型 57・获得必需的属性 59・获得可选属性 399・Tuple Filter 730・Union to Tuple 2059・Drop String 14080・FizzBuzz 734・Inclusive Range 741・Sort
#intersection31997・Parameter Intersection
#json6228・JSON Parser
#map62・查找类型 5821・MapTypes
#math529・Absolute 2257・MinusOne 25270・Transpose 27133・Square 27152・Triangular number 30958・Pascal's triangle 6141・Binary to Decimal 8804・两数之和 14080・FizzBuzz 274・Integers Comparator 476・Sum 517・Multiply
#number25747・IsNegativeNumber
#object599・Merge 645・Diff 2595・PickByType 2757・PartialByKeys 2759・RequiredByKeys 2852・OmitByType 2946・ObjectEntries 3188・Tuple to Nested Object 3376・InorderTraversal 4179・Flip 5821・MapTypes 27932・MergeAll 29650・ExtractToObject 2949・ObjectFromEntries 9160・Assign 9775・Capitalize Nest Object Keys
#object-keys7・对象属性只读 11・元组转换为对象 8・对象部分属性只读 9・对象属性只读（递归） 527・Append to object 1130・ReplaceKeys 1367・Remove Index Signature 2793・Mutable 28333・Public Type 7258・Object Key Paths 5・获取只读属性
#omit object-keys deep29785・Deep Omit
#optional31997・Parameter Intersection
#parameters31997・Parameter Intersection
#promise189・Awaited 20・Promise.all 32427・Unbox
#readonly7・对象属性只读 8・对象部分属性只读 9・对象属性只读（递归） 2793・Mutable 17973・DeepMutable
#recursion21220・Permutations of Tuple 1383・Camelize 32532・Binary Addition
#rest31997・Parameter Intersection
#split2822・Split
#string531・String to Union 8767・Combination 9142・CheckRepeatedChars 9286・FirstUniqueCharIndex 9616・Parse URL Params 21104・FindAll 30301・IsOdd 2822・Split 4037・IsPalindrome 19458・SnakeCase
#template literal25747・IsNegativeNumber
#template-literal106・去除左侧空白 108・去除两端空白字符 110・Capitalize 116・Replace 119・ReplaceAll 298・Length of String 529・Absolute 612・KebabCase 1978・Percentage Parser 2070・Drop Char 2688・StartsWith 2693・EndsWith 3326・BEM style string 4260・AllCombinations 4803・Trim Right 5140・Trunc 9616・Parse URL Params 10969・整数 21104・FindAll 112・Capitalize Words 114・CamelCase 147・C-printf Parser 270・Typed Get 300・String to Number 472・Tuple to Enum Object 545・printf 651・Length of String 2 2059・Drop String 19458・SnakeCase 151・Query String Parser 274・Integers Comparator 476・Sum 517・Multiply 6228・JSON Parser
#this6・简单的 Vue 类型 1290・Pinia
#tuple18・获取元组长度 3312・Parameters 10・元组转合集 3188・Tuple to Nested Object 3192・Reverse 3326・BEM style string 4471・Zip 4484・IsTuple 4499・Chunk 4518・Fill 7544・Construct Tuple 21220・Permutations of Tuple 27133・Square 27152・Triangular number 399・Tuple Filter 472・Tuple to Enum Object 730・Union to Tuple 2822・Split 30178・Unique Items 31797・Sudoku 32427・Unbox 7561・Subtract
#union4・实现 Pick 43・实现 Exclude 3・实现 Omit 10・元组转合集 62・查找类型 296・Permutation 531・String to Union 1042・IsNever 1097・IsUnion 3326・BEM style string 4260・AllCombinations 8987・Subsequence 9142・CheckRepeatedChars 21220・Permutations of Tuple 27862・CartesianProduct 27932・MergeAll 730・Union to Tuple 1383・Camelize 5423・Intersection 31797・Sudoku
#utils268・If 1042・IsNever 5821・MapTypes 55・联合类型转化为交叉类型 57・获得必需的属性 59・获得可选属性 89・必需的键 90・可选类型的键 223・IsAny 270・Typed Get 2828・ClassPublicKeys 2857・IsRequiredKey 5181・Mutable Keys 32427・Unbox 5・获取只读属性
#variadic31997・Parameter Intersection
#vue6・简单的 Vue 类型 213・Vue Basic Props 1290・Pinia
#数组5117・去除数组指定元素
#联合类型5117・去除数组指定元素
          

通过纯文本

热身 (1)

简单 (13)

中等 (97)

困难 (52)

地狱 (16)


> ✨ [即将到来的新题目](https://github.com/type-challenges/type-challenges/issues?q=is%3Aissue+is%3Aopen+label%3Anew-challenge) > 🔥 在 [TypeScript Playground](https://www.typescriptlang.org/play?install-plugin=%40type-challenges%2Fplayground-plugin) 开始挑战 > 🚀 无需网络，在[支持 TypeScript 的 IDE 或者文本编辑器](#离线挑战)中开始挑战 > ⚡️ 使用 [VS Code 插件](https://marketplace.visualstudio.com/items?itemName=YRM.type-challenges)开始挑战 ## 推荐读物 ### 官方资源 (英文) - [The TypeScript Handbook](https://www.typescriptlang.org/docs/handbook/intro.html) - [Unions and Intersection Types](https://www.typescriptlang.org/docs/handbook/unions-and-intersections.html) - [Literal Types](https://www.typescriptlang.org/docs/handbook/literal-types.html) - [Utility Types](https://www.typescriptlang.org/docs/handbook/utility-types.html) - [Advanced Types](https://www.typescriptlang.org/docs/handbook/advanced-types.html) - [The New Handbook](https://github.com/microsoft/TypeScript-Website/tree/v2/packages/documentation/copy/en/handbook-v2) ### 知乎专栏 - [来玩TypeScript啊，机都给你开好了！](https://zhuanlan.zhihu.com/c_206498766) ### 文章（英文） - [Learn Advanced TypeScript Types](https://medium.com/free-code-camp/typescript-curry-ramda-types-f747e99744ab) - [The Art of Type Programming](https://mistlog.medium.com/the-art-of-type-programming-cfd933bdfff7) - [Type Query: jQuery Style Type Manipulation](https://mistlog.medium.com/type-query-jquery-style-type-manipulation-497ce26d93f) ### 视频 - [Type Level Programming in Typescript](https://www.youtube.com/watch?reload=9&v=vGVvJuazs84) ### 项目 / 题解 - [Type Gymnastics](https://github.com/g-plane/type-gymnastics) - [Type Challenges Solutions](https://github.com/ghaiklor/type-challenges-solutions) - [TypeType Examples](https://github.com/mistlog/typetype-examples) ### 书籍 - [Effective TypeScript](https://effectivetypescript.com/) - [Learning TypeScript](https://www.learningtypescript.com/) - [TypeScript in 50 Lessons](https://typescript-book.com/) - [TypeScript Cookbook](https://typescript-cookbook.com/) ## 参与贡献 你可以通过如下几种方式参与贡献这个项目 - 分享你的答案或解题思路 - 提案加入新的题目 - 完善已有题目的测试用例 - 提供针对题目的学习资料或方法 - 分享你在真实项目中遇到的类型问题（无论你找到答案与否）- 大家会一起帮你找到解决的思路 - 通过在 Issue 下留言帮助他人 - 帮助完善这个项目的更多部分，详见 [TODOs.md](./TODOs.md) [开一个新的 Issue](https://github.com/type-challenges/type-challenges/issues/new/choose) 并选择相应的模板即可，感谢参与！ > 💡 尽管你可以使用中文进行讨论，我们还是鼓励你尝试使用英文发起 Issue 与评论，这样可以让你的问题被更多人看到也可以帮助更多人。 ## 离线挑战 你可以在本地生成这些题目，然后用你熟悉的任何支持 TypeScript 的 IDE 或者文本编辑器开始做题。 构建这些题目前，你需要安装好最新版的 [Node.js](https://nodejs.org/) 和 [pnpm](https://pnpm.io)。 克隆此仓库后，运行下方命令行安装依赖： ```bash pnpm install ``` 然后，运行生成脚本： ```bash pnpm generate ``` 这将会提示你选择语言，然后你就可以在 `./playground` 文件夹中找到生成的题目。 如果你想要在保留自己的答案的情况下获取题目的更新，可以运行： ```bash pnpm generate --keep-changes ``` 或者 ```bash pnpm generate -K ``` ## 致谢 这个项目诞生于 [@hardfist](https://github.com/hardfist) 和 [@MeCKodo](https://github.com/MeCKodo) 两位朋友做的类型体操。同时也非常感谢 [@sinoon](https://github.com/sinoon) 在项目初期提供了宝贵的反馈意见与参与的贡献。 ### 灵感来源 - [piotrwitek/utility-types](https://github.com/piotrwitek/utility-types) - [psmyrdek/typescript-challenges](https://github.com/psmyrdek/typescript-challenges) - [andnp/SimplyTyped](https://github.com/andnp/SimplyTyped) ### [贡献者](https://github.com/type-challenges/type-challenges/graphs/contributors) ![Contributors](https://contrib.rocks/image?repo=type-challenges/type-challenges) ## 使用的协议 MIT