Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Modern TypeScript

Modern TypeScript

Modern TypeScript coding techniques and tips.

More Decks by Taketoshi Aono(青野健利 a.k.a brn)

Other Decks in Programming

Transcript

  1. // ҎԼͷܗࣜͩͱ0΍ۭจࣈʹҾ͔͔ͬΔ value || orValue value? value: orValue // Null

    Coalescing͸ҎԼͷܗࣜͱಉ͡ޮՌ value != null? value: orValue
  2. const fooAction = (payload: {value: string}) => { return {

    type: "FOO" as const, payload } } const barAction = (payload: {value: string}) => { return { type: "BAR" as const, payload } } type ActionTypes = ReturnType<typeof fooAction> | ReturnType<typeof barAction>; // "FOO" | "BAR" const reducer = (state: State, action: ActionTypes) => { switch (action.type) { case "BAZ": // Error '"BAZ"' is not comparable to type '"FOO" | "BAR"' ... } }
  3. const foo = (type: 'foo' | 'bar' | 'baz' |

    'qux') => { ... } foo('foo'); foo('bar');