TypeScript and Immutability

TypeScript and Immutability

TypeScriptでImmutableなエンティティを表現する方法あれこれ

Transcript

  1. TypeScript & Immutability

  2. Name @brn (ꫬꅿ⨳ⵃ) Occupation ؿٗٝزؒٝسؒٝآص،٥ط؎ذ؍ـؒٝآص، Company Cyberagent ،سذؙأةآؔ AI Messenger

    OSS Contributor of V8 About http://info.b6n.ch
  3. What is Immutability?

  4. Immutablityהכ㢌刿♶〳腉䚍ךֿה TypeScript(javascript)דכ㛇劤涸חכׅץג㢌刿〳腉(Mutable) 㹋植ׅ׷׋׭חכ㢩鿇ךٓ؎ـٓٔך⸂׾⦵׶׷ַծأفٖحس 怴皾㶨׾⢪ְתֻ׷׃ַזְ What is Immutability?

  5. Why Immutability is so important?

  6. ؔـآؙؑزך㢌刿ָ♶〳腉ד֮׷ֿהכفؚٗٓي׾⟃♴ך銲 挿ד知患חׅ׷ •  ⿫撑鷲麓䚍(ꟼ侧ָ⦼׾㢌刿׃זְ) •  ⶰ⡲欽ָ饯ֹזְ ؙٓ؎،ٝز؟؎سךفؚٗٓىؚٝדכ⟃♴ךⵃ挿׮֮׷׌׹ ֲ •  ReactךPureComponentד知⽃ח嫰鯰דֹ׷

    What is Immutability is so important?
  7. Immutability in REAL LIFE

  8. ׃ַ׃TypeScript(js)ד㹋植׃״ֲהׅ׷ה⟃♴ך㉏겗ָ֮׷ •  ٓ؎ـٓٔ⢪ֲ •  IOכוֲׅ׷(DOMծhttpծStorage) •  㘗דⴻⴽדֹ׷ Immutability in REAL

    LIFE
  9. Immtauble.js Immutable.jsכTypeScriptה湱䚍ָ䝤ְ הֻחⰅ׸㶨ךRecord׾㘗ד邌植׃״ֲהׅ׷ה immutableז㘗ה׉ֲדכזְ㘗׾㹀纏2ꅾד㹀纏ׅ׷䗳銲ָ֮ ׷ Immutability in REAL LIFE

  10. immer immerכPlainObject׾Immutableח׃גֻ׸׷ךד⢪ְװְׅ ָծclassָ⢪ִזְךד䮶׷莸ְ׾׮׋ׇ׷㜥さכ Objectחًاحس׾㹀纏ׅ׷䕎חז׷ ָծ׉ֿכ䧮䢧׃גimmer׾⢪ֲֿהח׃׋ Immutability in REAL LIFE

  11. How to treat IO 姻湫10ⴓד鑧׃ֹ׸זְךד㸣穠ח •  MVI(Cyclejs괏)׾ⵃ欽׃גծIO׾㢩ך⚅歲חꟗׄ鴥׭׷ (Driver) •  穠卓׌ֽ׾ActionהⰟח「ֽ《׷

    •  reduxד֮׸לmiddlewareחIO׾ע׿䫎־׷ Immutability in REAL LIFE
  12. Model View Intent ًٔحز •  ٌشسקו搀椚זֻIO׾ꟗׄ鴥׭׵׸׷ •  asyncחאְג罋ִ׷䗳銲ָזֻז׷ رًٔحز • 

    Actionךװ׶ה׶ָꬊ䌢ח㟓ִ׷ Immutability in REAL LIFE
  13. How to express immutable type. TypeScriptדImmutability׾邌植ׅ׷׋׭חכ⟃♴ך倯岀ָ֮׷կ •  readonly׾⢪ֲ •  ConstArray٥ConstMap׾⢪ֲ

    Immutability in REAL LIFE
  14. Readonly فٗػذ؍ָ铣׫《׶ך׫ד剣׷ֿה׾㹑鎉ׅ׷ ׋׌׃ؔـآؙؑزך⚥魦כ㢌刿〳腉 Immutability in REAL LIFE

  15. ReadonlyArray٥ReadonlyMap 灶㠨涸ז㢌刿׾遤ֲꟼ侧ָ⵴ꤐׁ׸׋غ٦آّٝך㘗㹀纏 TypeScriptח穈׫鴥ת׸גְ׷ sort٥reverse٥spliceהַדֹזְ(㘗㹀纏♳) Immutability in REAL LIFE

  16. ֿ׸׵׾穈׫さ׻ׇג邌植ׅ׷ C++ח֮װַ׏גConst㘗הㄏせ׃׋ ׁ׵חׅץגך㾩䚍׾《׶ꤐֻMutable㘗׮㹀纏ׅ׷ (׋׌׃ծConstMapכ⢪׻זְךד♧傉㹀纏׃זְ) Immutability in REAL LIFE

  17. type Primitive = undefined | null | boolean | string

    | number | Function;! ! interface ConstArray<T> extends ReadonlyArray<Const<T>> {}! type ConstObject<T> = {! readonly [P in keyof T]: Const<T[P]>! };! ! type Const<T> = T extends Primitive! ? T! : T extends ConstArray<any>! ? T! : T extends (infer R)[]! ? ConstArray<R>! : T extends object ? ConstObject<T> : T;!
  18. type Mutable<T> = T extends Primitive! ? T! : T

    extends MutableArray<any>! ? T! : T extends (infer R)[]! ? MutableArray<R>! : T extends ConstArray<infer A>! ? MutableArray<A>! : T extends object ? MutableObject<T> : T;! ! interface MutableArray<T> extends Array<Mutable<T>> {}! ! type MutableObject<T> = {! -readonly [P in keyof T]: Mutable<T[P]>! };!
  19. ֿ׸דطأز׃׋Ⰻגךؔـآؙؑز׾Immutableחדֹ׷ ׋׌ծOptionalהַPromiseהַָ窃׬ה꬗⦜זֿהחז׷ (ConditionalTypeך勴⟝ָו׿ו׿㟓ִ׷) Immutability in REAL LIFE

  20. Writable/Writer 荈⡲ךؒٝذ؍ذ؍ד׮ReadOnlyXXX׫׋ְזך׾װ׶׋ְ ؒٝذ؍ذ؍׾㹀纏ׅ׷הֹחفٗػذ؍ך׫ךؔـآؙؑزה 刿倜ך׫׾遤ֲWriterחⴓꨄ׃ג㹀纏ׅ׷ Writableכ朐䡾ך㝄 Writerכ朐䡾׾䭯׋׆ծ刿倜ׅ׷׋׭ך乼⡲ך׫ָ㹀纏ׁ׸גְ ׷ Immutability in REAL

    LIFE
  21. interface HumanEntityWriter extends Writer<HumanEntity> {! updateName(name: string): void;! updateAge(age: number):

    void;! }! ! interface HumanEntity extends Writable<HumanEntityWriter> {! name: string;! age: number;! }!
  22. interface Writer<T> {! _target: T;! }! interface Writable<T extends Writer<U>,

    U> {! _writer: T;! }!
  23. mutate Writableַ׵Writer׾《׶⳿׃ծMutableח㢌䳔ׅ׷կ Immutability in REAL LIFE

  24. const next = mutate(humanEntity, writer => {! writer.updateName('Roppongi.js');! writer.updateAge(6);! })!

  25. import produce from 'immer';! function mutate<T extends Writable<U>, U>(! entity:

    T, ! callback: (writer: U) => void! ) {! produce(entity, draft => {! callback({! ...entity._writer,! _target: entity! });! });! }!
  26. Benefit ReadהWrite׾ⴓֽג㹀纏ׅ׷ֿהד搀꼽ז✲佦ָ幾׷ ת׋ծWriterךًاحس⟃㢩ד⦼׾㢌刿ׅ׷ֿהכדֹזְךד (㘗٥暟椚ך⚕꬗ד)㸜Ⰻ Componentך⚥ד⦼׾剅ֹ䳔ִ׋׶דֹזְ Immutability in REAL LIFE

  27. Complicated types… 㹋ꥷחכmutateꟼ侧ך㹀纏כ׮׏ה醱꧟ד ConstהMutableך㢌䳔㹀纏ָⰅ׏גְ׋׶ׅ׷ Immutability in REAL LIFE

  28. Problems immerָؕأةيؙٓأ׾「ֽ➰ֽזְֶַ־ד entityワ׶ָ׍׳׏הES5괏חז׏ג׷ •  class׾⢪׻זְ •  竰䪫כأفٖحس怴皾㶨 •  فٓ؎ك٦زفٗػذ؍כ،ٝت٦أ؝، Immutability

    in REAL LIFE
  29. Summary ׍׳׏ה㉏겗כ֮׷ֽו筨ׄגװ׶װֻׅז׏׋կ Immutable.jsד气䒦׃גְ׋ךד⡭鎘״ַ׏׋ Plain Object剑넝 Immutability in REAL LIFE