Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Better Support for Functional Programming in Angular 2

Better Support for Functional Programming in Angular 2

  • Login to see the comments

Better Support for Functional Programming in Angular 2

  1. 1. a? ' : : 'c Better Support for Functional Programming in Angular 2 Why FP? .. .MM . ..n. .. . ..w. .. ___ a. ..” . ... ._ . ..m. .. . . un: na . ..m. .. u. .. m. .. . ..m. .. ___ ___ . w: eeeeeee mn IV! n' 'a . ` 'Huy
  2. 2. Better Support for Functional Programming in Angular 2 WhyFP? .. .m. .. . .u. . . ..w. .. ___ __ _. .. o. .. . ..M. .. nn- n- . ..e. ... _. m. .. m. .. . ..m. .. ___ ___ v mm nmu: rrrr 4m
  3. 3. :ílfigiiivéaíii-inr H-ioilríthiáli; : IIi(-_Ia. ~~-«-nu, -:-ni4ii "ini-Line H-inigz-inizici" YUI-Liv O-mulgi-iniáui' i'l-Li" H-inlrí-iiiáni i/ i/t/ atrvrtt F” " _rei : Iglyiii-iaiii-iil rv #lit-liv fíçiunjjigiiifici- ilkilii ltítiilkiziliali ` Oi-injgi-iiiaifv V' l Tail-ir ru-; t-r 'meh. i ifíginiízginifiiit war-à? Iiieili? i
  4. 4. Data Instead of Mutable Objects WIPAIIgHIGVI triumph 'i««~ roansromnonm r . , . - ii45iii(“ijg: NK[F: z [i -naman . il. umm-mi i. thzniirtin) “>( m, itodns rlxhmulàiiiviíai -. rcplutcPropertyitwdoi Numunazenatcii i: i chackAllii i liunlndos - Hvislndnmmapiituaoi w rgplarnPrupPrtyHoDo, - 4d) i numhermtheckedii i my" n; .tnaasJllleriitndoi a mnmznezkealJengzh i i Change Detection Persistent Data Structures WIPAnguluIZ uri-ample Vi! todos r . m. Immurahiensüi, 1.1! mans: Laddltadol, MJ! todos! llst. rlplata(lndn newiodoi exvinirodauinocanzainiroaoi expectixcdoszLtocunzamüieuiudui expect(todos? ).not. rotontaxnlzodo) < todos iemplaie-"n [lodo]= "tudo">z/ todus> controlling Change Detection WiPAnguiarZ ! lumpia iidx~ TodosComponent i : nnnim: toricrthangebetector. storrTndcStorei < tiizntndos Immutahlemsbenptyii storemnthangeií) : > ( umaamin: : StcrLtodoSU: ggmhackoncaii. H, i i Input & Forms
  5. 5. Data Instead of Mutable Objects WIP Angular2 example class TodosComponent { constructorihttpzHttp) { thís. todos = (]; http. get("i't0:: <1s"). b thenHresp) = > { thís. todos = resg. map((tod0) = > rep1aceProperty(todo, `Catc', humanizeDate)) }); } checkAlUi t this. todos = this. :'i: odos. map((todo) = > replacePropertyVcodo, `("(-r-0c “ , true)); } numberOfCheCKedH { return thís. todos. filter((todoi = > todo. checked).1ength; } l*
  6. 6. Persistent Data Structures WIP AnguIar2 example var todos = new Immutab1eList(); var todosl 1ist. add(todo); ver todos2 1ist. rep1ace(todo, newTodo); expect(todos1). toContain(todo); expect(todos2). toContain(newTodo); expect(todos2). not. toContain(todo); <todos template= "ng-repeat: todos; in: #todo" [todo]= "todo' '></ todos> "n I r , ,I Prezi ` "f! l I `
  7. 7. i_`. ”`cfl. ni`. `iíi'tll'ir 3:( '_`fíiçtiu3;. ' _f irJiryi-: Lliiílii i'll, ” «angal-liar i ; sammie «hunt "Hilot-T': Ilillslnmqgii i -i-iiidlrPli-ivül", ij-Ifinlnulaüiàiituàítol' ; j1o1_"_; _g-1`IIII_lIl~'íi(0I"'-I ; MFF- T-Iol-ion: - _IiiiiillihlilhaílijlriãJunior" jioxçanloliiihloului 9 ` qiPlü. KIIIII): r : ulj_'íã, (nilapi- i. . -liI-. i-i{(| ioI-(ui` i : Kravgi
  8. 8. Data Instead of Mutable Objects win Angular2 (temple un; Toausromoonenr l conxtructarirgtgmrtvi i IVIILKUED; : ii. ummm i. ttitrillrtii) ~> i KHALKOUDS r runmuuiitnaoi > raolutzPropzrtyltwdü, , Pumniuzenntcii i (huuliii i annaman, ~ (hialaaomlaniiioaoi -> repiarnPrnpe>tylruuo, , umi, i nunemnnecxeaii i return thlmtaansJllterlltodni : s tnanmnezledlJenqrh; i i Change Detection Persistent Data Structures Controlling Change Detection win Angular] example nr todos n n. .. Zmiliirahleiisü): ur todos] Lshaddltudai; Wiünzvlarlammnle var todos2 Lrepiaceitodn, neuindoi; : inu Tudostumponent i expect(loans! Lrofnnrninlrodn); constructoricd'Changebeteztor, sturrTodoãtvrei i expectixodosziautunzamineuioduiz thiLtndus Immutableizsnenptyi); expect[lodosümot. lotonuinllodoh ; tormnnthangeili : >( thiLtodos : sroremcaosi); :mtheckoncell: H; <todos ) template: n -repeai todos. li'l #todo" I [lodo]= "ludu">z/ lodus> Input & Forms
  9. 9. nemu i i m. .. mi . m. m_ VIIIV m_ _. v . .._iii. i,iiii_ m. .. VFYuVI i. .. irvjnn un. . , ,di ~~ “i, b-ilerii i. i i NgModeI Needs Mutable Objects . im npuilwg llpulítvñ'l'i. üd Lmiuüairu inlirfifwiairvfv' Ufvlalh WITN* WIP miiiiiiz Vlilllü* dos) Todntnmpn-ewt i [UUL mma; r-li'li vAttxwsi cennrunor(actions-Athensil mu ii a: - ) uvditeiudn( gm VudD) 4 i ) ann, ,, i I ` 'nu` P-fwr @victorsavkin Hilcidex ruwvivanuli i. :): xi'Il<iiI0)I1 J{(/ Iiw_i | m_ i, Mutable Components wi» nam: .. ma. - 0.. .,. . i. .. VGCI (ampnnc (onllructer ru (Hirqrhrvrrtnr, . m. tnan' _ xmiimm . .- enptyi _ mi, .iiiz- nga ii i nm mm : siaimnaasii. :uminum V ii: i Input & Forms wmhbmnolidcai Forms = Streams oI Values iwi _zwilml gmupi. iilTiStQim". tim. .. tortmi- amiipiim u . iiwizcma. çlwvkcdH ino-mi wi» Angular) ammgk imiimin Getting the Current Value incnculptrrir li . m, .. lünlllw(lnliztiiu'n Alllu . .i i . m. ii _ Ml,1v. HP¢IEVDHG i i i, .gi i . m- ii . annaman. .. i . m iqiiivzii-.
  10. 10. .líügüítíüffàí/ _Füaaçííbi . »`l. i!. i_irçtl, êtí; r Ifüac: à.-: «dI-mn num [n534nuxékallHãqxdkçuékçmcngaun! "- nupxulí _II[gf-mll! XdHIF"ioldtonrãilãldküif"~ ! Touiiiunr(ctltctükülgxdkiialloldloxíiçxikd? "ü'. ishikikay. , 'Touiimnr ~. Hymn 'lllr'^v. 'hl;4llfqllfrxandy? : 1-. $031: Tol-JWIollnlplolnlàlnl? jolchm Tanjon- : u ' hm: --: I"j: l0lII-'- cut-md: 'ID' {on '~ 21"" gong-_u 'kj-In. - -4 ? hE-li : I " 10m: - = |". “50]| E_- uglqhlírfíolqlon __9_'_o11Loj. ;”~`o| n[o«
  11. 11. .r`4lti, 'létl_l'l_la' Cilílnítjfn?161113113# 'lvlmvngzttqctê ? mtulgllã 'Hinila-rhqmmzrtétaetl 14th** 'loli[sFZ-lnlylllllàloii KIIIIII-. HIIIIIID- -lzL-I-Iwlg inuuwi-IMI: )- duaditu-Hil-I-Iuzlnr : u-aitfl-Inu-Ivn-uiürjluulcg -t-lnnjqanmivlv' : png-myg-iülolulvl” íIiv1-. :u-Ii: .`0nr - ; Loki-kunta- 4-J- ; qolílollig my. nam. _ a; ii>jm~. .-I= an-u' : lm - ; allald-Pàjpiiíñlülll- Iiilxulilu-íkàl- - ; ulam-muah ugihlviallonílolw Ii)}~. -:l-II. ]IlIL4Ij ` IiQIIIIIIOWQiPILH. i-uInjl-, L IIl= t:I-I"«3_0Ii; ]-lII-I iir}~“n-llãt-1ll'üyliífllll. dilat-lkad* íir}“--diludííãlll`n'~-
  12. 12. _P`<i1hn_i, L-: =' fíilrçtçrjzilsw' : IF Vanny? : «fiollm _Lemniml-«glnlllplláwlüalílFallin! " nnlpxuii cçxnuir-. Ibsm-: t-. Lxcngnun"» {lllplqii çzolnlilçlk'“clnladkaojl"v ~. r'ísliínr 'AVlr'^': II}3!llI. tl»"àxqtnlylla -Ilzwr ? íííiaüdff- Ilglnulàl " i -I-I-Hyuugoy! "fgaànnuulêurílgtgar nagmumuni-nn iiílàAíiiiàliü3tltul : - _QN -IaL-uu-hlgt-o-*mcn . aansu. #insulin-le ix-n-Il-_r-Iuu In- Iírík. x ; jiiãüiíi-Illlnügllügk) . itatç-x-I-Inuigll-VHIL ; isnan-lili ü-uuvblbjql a 4 zlslillslnm-dífliialFlolil-I-íãíunultllxa! . dh-
  13. 13. «_Ji;1.i: “ü: ;;: ' itim: ~_`. `1I. H.K_=4.n. :;rí^ Value' dom-wñmctnàoxunn. [nanm-xu. itangi-rumMinnt-v"- nung! niit-(o1niiIo1b= <“dtam-1ngnunt"- nngnnirxxonn: nw-nasuot aol"- lbxqiiitçxuntnnr-çlltdü "ugn@lalialfudloltíqxálçlhnnnvrall! lál"*ll. lpxdlaiiawfülliiítollv #funny 'AV/ lfhhtglllqllfr911111131!: : -Inne `lololoVí-llllslvlllàlnii inalala 'lolah! - m' iíítolol-“I-iti-iií-lollt-“I- qnhyiir'llh'qnlr'ltzlntiíjohkj-ià-lijzlonp_ 4 all_ `. ..: |n'i_]u| u: s : |n'. -i“'! ohj_. j- njguíhijtslhgojlul__pmlmguuga 4 liürüuzu'íílvlllt-~! l9I! FIK4"| ilI| * 302k. ilu-II- íli. Iàlílílüàuüí-_í- #11141
  14. 14. (recall i 1 m. mm . m. m_ VIIIV m_ _. v . .._`_. «,m`_ . .m. . raw: m. w". un. . nAh ~~ mg, .. aw w. v » NgModel Needs Mutable Objects . rm npullvrg npulírvgsrvudd muztah: : , ,u-umaaraw : muw lvulw* wrv WM: nam. * dhs) Todncnmpn-ewt l [UUL mma; . wn vAtuws; (annrunorlaclions-AuzansVl mu n a: - ) unaazgruau( gm nam) 4 b ) ann, ,, . . I ` 'nu` P-fwr @victorsavkin x-rmuu . ..-`-«. ..«. z: n : ):xA'! <IAIo)Z1 nam_ u m_ u, Mutable Components w» “Mu numb? 0.. .,. . m. van (umpnnc (vnllruztnr ru (nvrqrhrvrrlnr, . m. vndn' _ Imunmn . .- . ..m _ n. .., .. nt- nga i: l nm mm : slweJndasH. (Gwnsnnrte , n: y Input & Forms wambwnondcur Forms = Streams oI Values lwm ; wxlml group} lwlwsturm". angal mrvml- dcscnplmn u . Wüíltürllüh çhzvkcdH l/ Vowm ww Angular) ammgk Yn1n4'nn~ Getting the Current Value vacmnpun. IV . m, .. . .n. n.u. u.u. u-, .. .w -_ a . m. _ _ N<l,1vC. HP¢IEVDHG r v l, .gw 4 . m- _ . mnatzrzduwxhi. w . xu ? arw/ zhen
  15. 15. - Twitter @victorsavkin “III” Prezi “Ju”
  16. 16. a? ' : : 'c Better Support for Functional Programming in Angular 2 Why FP? .. .MM . ..n. .. . ..w. .. ___ a. ..” c. .. . ..m. .. . . un: na . ..m. .. u. .. m. .. . ..m. .. ___ ___ . w: eeeeeee mn IV! n' 'a . ` 'Huy

×