functional programming - How does the following function call work in Javascript -


i've been playing code associated this cool article.

in articles code variable assigned function follows:

var messagefactory = (function() {     var = {},         $chatmessage = $('<p></p>').           addclass('chat message'),         $nick = $('<span></span>').           addclass('nick'),         $systemmessage = $('<p></p>').           addclass('system message');      var chat = function(message) {       var $fillednick = $nick.clone().             text(message.nick + ':');       return $chatmessage.clone().         append($fillednick).         append(message.text);     };      var system = function(message) {       return $systemmessage.clone().text(message.text);     };      that.chat = chat;     that.system = system;      return that;   })(); 

later sub functions called following,

messagefactory.system({ text: 'you changed nick ' + nick + '.'}) 

and

messagefactory.chat({ nick: 'me', text: message }) 

what's going on in calls? appears var messagefactory working similar class definition in language c#, , i'm missing scope related mechanisms how values being passed via object { text: '...' ...}.

thanks much!

the first , arguably important thing note last line. specifically, () before ;. doing executing anonymous function on line 1. important note because messagefactory not contain anonymous function, rather whatever returned it. better understand that, i'll give example...

var x = (function(){ return "hello!"; })(); // x contain "hello!", not function. 

the second thing keep in mind objects in javascript maintain reference closure created in. if execute function we're doing above, form closure , objects created in closure maintain reference after function done executing. example....

var sayhi = (function(){      var salutation = "hello";     return function(name) {        return salutation + ", " + name + ".";     } })(); 

note again have anonymous function being executed. variable sayhi not contain outside anonymous function, rather it's return value. sayhi contain function(name){ return salutation + ", " + name + ".";}. you'll note we're not passing in salutation, can still access it's part of closure function created in.

the final thing understand provided code in javascript, {} object literal. it's equivalent saying new object(). these objects can have properties , methods same c# object, .text coming referred to.

on line 2, code creating object literal: var = {}. next var creation var chat = function(message){.... function created takes message parameter , stuff it. towards end of code, chat function assigned chat property of that , that returned: that.chat = chat , return that.

the point of messagefactory not contain function appears assigned to, rather return of function. in case, return that object, has 2 properties of chat , system. properties point chat , system variables inside same closure that created in, makes work.

the final piece simple enough.... when call messagefactory.chat({ text: 'something', nick:joe}) you're passing object parameter chat function inside closure. references object's nick , text properties return result.

hope helps. i'm not sure explained well, that's kind of how works in head.


Comments

Popular posts from this blog

c# - SharpSVN - How to get the previous revision? -

c++ - Is it possible to compile a VST on linux? -

url - Querystring manipulation of email Address in PHP -