TypeScriptで集合に対する操作を実装する
type RegisteredUser = { kind: 'registered', id: string, name: string, } type TentativeUser = { kind: 'tentative' id: string, name: string, } type User = TentativeUser | RegisteredUser みたいな構造が存在した時に User[] に対する振舞いを定義したい!みたいなモチベーションが発生することがある。 例を上げると、登録済みのユーザーのみでfilterしたい!みたいな感じだ。 フロントエンドのコードを書いたり見たりしたりすると、やりがちなのは User[] で引き回してコンポーネント側で次のようなコードで実装するやつだ。 import { FC, useMemo } from 'react' const UserCard: FC<{ users: User[] }> = ({users}) => { const registeredUsers = useMemo(() => { return user.filter((u): u is TentativeUser => u.kind === 'registered') }, []) return <>.
Posted