[TypeScript]具体例で理解する、配列から"その配列型"と"その要素のUnion型"を定義する方法とその使い道 - Qiitaconst STATUSES = ['A','B','C'] as const type Statuses = typeof STATUSES; // readonly ["A", "B", "C"] type Status = Statuses[number] // "A" | "B" | "C" 忘れてはいけないのはas constをつけて配列を定義することである。 as constがない場合、TypeScriptは['A','B','C']をA,B,Cだけからなる配列としてではなくこれを抽象的に解釈した文字列の配列(string[])として解釈してしまうからである。 Statuses[number]で配列の要素をメンバーとするUnion型を生成できる理由はsuinさんのこの記事が大変参考になった。 具体的な使い道 前提 例えば、Trelloのようなタスク管理アプリケーションを作ってい
![[TypeScript]具体例で理解する、配列から"その配列型"と"その要素のUnion型"を定義する方法とその使い道 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/cec4417eaa634eef4ae6c347913e3abfbf79ca14/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fadvent-calendar-ogp-background-7940cd1c8db80a7ec40711d90f43539e.jpg%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCVHlwZVNjcmlwdCU1RCVFNSU4NSVCNyVFNCVCRCU5MyVFNCVCRSU4QiVFMyU4MSVBNyVFNyU5MCU4NiVFOCVBNyVBMyVFMyU4MSU5OSVFMyU4MiU4QiVFMyU4MCU4MSVFOSU4NSU4RCVFNSU4OCU5NyVFMyU4MSU4QiVFMyU4MiU4OSUyMiVFMyU4MSU5RCVFMyU4MSVBRSVFOSU4NSU4RCVFNSU4OCU5NyVFNSU5RSU4QiUyMiVFMyU4MSVBOCUyMiVFMyU4MSU5RCVFMyU4MSVBRSVFOCVBNiU4MSVFNyVCNCVBMCVFMyU4MSVBRVVuaW9uJUU1JTlFJThCJTIyJUUzJTgyJTkyJUU1JUFFJTlBJUU3JUJFJUE5JUUzJTgxJTk5JUUzJTgyJThCJUU2JTk2JUI5JUU2JUIzJTk1JUUzJTgxJUE4JUUzJTgxJTlEJUUzJTgxJUFFJUU0JUJEJUJGJUUzJTgxJTg0JUU5JTgxJTkzJnR4dC1jb2xvcj0lMjMzQTNDM0MmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wZDc0Y2VkMTI0OTI1NmFmMDVkODY5NTVlYjhjNmVjOQ%26mark-x%3D142%26mark-y%3D100%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9OTcyJnR4dD0lNDBzaHVuZXhlJnR4dC1jb2xvcj0lMjMzQTNDM0MmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0yMTg1MmJjYjEwYjkzNTI0NzdkOGQyNTViMTUxNzRhNA%26blend-x%3D142%26blend-y%3D504%26blend-mode%3Dnormal%26s%3D73b8bb5c0e71b73b32a89e69ad0d795e)
