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.

Closures In JavaScript

258 views

Published on

Some ideas about the using of closures in javascript

  • Be the first to comment

  • Be the first to like this

Closures In JavaScript

  1. 1. Closuresin JavaScriptA Closure JavaScriptben<br />The clientside MVC system: Wherecould be theclosureuseful?<br />A kliens oldali MVC rendszer: Hogyan lehet a closure hasznos?<br />
  2. 2. What is theClosure?Mi a Closure? <br />var functioninClosureSheeper()<br />functionsetSheeper()<br />var inclosuresheeps<br />functiongetSheeper()<br />Howmanysheepsdowehave? Whycan’t he hearme?<br />Hány birkánk van? Hééé? Miért nem hall ?<br />Tryus! Wehavedirect line tohim!<br />Próbáld velünk! Van egy közvetlen vonalunk hozzá!<br />functionoutOfClosure()<br />
  3. 3. Toget more real: clientSide MVCÉletszerűbben: Kliens oldali MVC <br />Tehát a closure segíthet nekünk olyan esetben, ha valamit el akarunk rejteni a globális névtér elől, akár a saját, akár programozó társaink segítégére.<br />So, theclosurecanhelpustohidesomethingfromtheglobalscope, tohelpthecoding of ourselves, orthecodingofothers.<br />Röviden a másik oldalon: / To be short (Revealed Module Pattern by Christian Heilmann) inthenextslide:<br />
  4. 4. varglobal = (function() {<br />varprivate;<br />varprivatemethod = function() {<br />//blablalba<br />}<br />return {<br />priveteGetter :privatemehtod//<= setthereference<br />}<br />})();<br />privatemethod(); //<= wontworklikethis<br />global.privateGetter() ; //<= works<br />Tehát ha akarunk egy Rajzprogramot / Ifweneed a Drawing program:<br />Model(an objecttohandlingdrawnobjects, hold theirproperties, algorithms of shapes, etc. /Egy objektum mely a rajzolt dolgokat kezeli, tárolja tulajdonságaikat, stb)<br />Controller(an objecttohandlingevents, getsthemfromtheView, and updatestheModelaccordingly / egy objektum mely kezeli az eseményeket, melyek a View-től érkeznek és ennek megfelelően frissíti a modelt<br />View (The shapesdrawingtool, as SVG or <canvas> oranyjavascriptdrawinglibrary –JSXGraph/ Az alakzatokat rajzoló eszköz, SVG vagy <canvas> vagy bármilyen javascript függvénykönyvtár, plJSXGraph)<br />
  5. 5. Miért jó ez nekünk?Why is itgoodforus? <br />Wecanmakeournicemethods, to be allprivate, thatlatercanbechanged, withouttheneedtochangethe most used (public) methods of thecode /Elkészíthetjük a saját privát metódusainkat, később változtathatunk a kódon anélkül, hogy a több helyen használt (public) metódusainkon változtatnánk.<br />The code is nicelyseparated, and easytofindormaintainthings / A kód olvashatóbb, és könnyű karbantartani vagy megtalálni dolgokat.<br />The samenamecan be used more times, soit is easytoremember, and fit inthegivencontex / ugyanazt a nevet használhatjuk többször, így egyszerűbb rá emlékezni, és jobban illeszkedik az adott környezetben.<br />Ifweplantoshareourcode, ormake a biggerlibrary, it is esayto update ormodifywithoutbreakingother’scode / Ha mások is használják a kódunkat, vagy függvénykönyvtár létrehozását tervezzük, könnyebb a frissítés anélkül hogy mások kódját tönkretennénk <br />
  6. 6. Sosee an example – inthegraphical program weneed x and y. Becauseweusedtoit, and itfitsinthecontext, anddon’twanttobotherwith x_1, x_m, x_v orothernames / Lássunk egy példát – egy rajprogramban szükségünk van x – re és y –ra. Mivel hozzászoktunk, beleillik a környezetbe, és nem akarunk x_1, x_m, x_v változónevekkel vacakolni.<br />varView = (function() {<br />var x, y;<br />vargetx = function() {<br />return x ;<br />};<br />varsetx = function(val) {<br /> x = val;<br />};<br />return {<br />getX:getx, //<= setthereference / adjunk referenciát a privát függvényre<br />getY:gety<br />}<br />})();<br />varController = (//dothesamewithController and Modeltoo – ugyanígy írjuk meg a Controller és Model objektumunkat is<br />//usage: codenicelyseparatedwithwellknownmethods /használat: a kód olvasható, mégis az ismert metódusainkat használjuk<br />View.getX();<br />Controller.setY(val);<br />
  7. 7. Thanksforreading / Köszönöm<br />Ancsin Gábor (ancsingaboristvan@gmail.com)<br />

×