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