Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / NewStats: 3,195,581 members, 7,958,795 topics. Date: Thursday, 26 September 2024 at 01:12 AM |
Nairaland Forum / Science/Technology / Webmasters / A Brief View On Asynchronous Modular Dependency Javascript (1441 Views)
Wapmasters - Learn How To Create Mobile And PC View On Wapka.mobi / Make Your Blog Appear In Desktop View On Mobile Browser / How To Use Ajax (asynchronous Javascript) (2) (3) (4)
A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 10:18pm On Jan 07, 2012 |
Hi outta boredom and reading for exams decided to roll out a simple discussion on the new way of writing JavaScript, and its a specification proposed by CommonJS the group who regulate APIs and specs for JS on Browser, Environments and Servers. to skip the boring part if you have ever written JavaScript you know how easy it is to get lost in function upon functions, after all unlike static type languages JavaScript has no support for class like system or package system. the closest was the framework which i use Dojo and it provide the ability to create a modular way of writing JavaScript with AMD, all frameworks can be written in a modular manner which will split files into numerous parts(modules) and can be accessed at will, also now it makes it easier to only request certain features from a framework, meaning i could use my dojo loader and require a jquery animation module. there are two api in AMD Define and Require. Defines is used to define a module lets just say it creates a comptabile module that would be loaded with the require function and it goes like this. define( module_id /*optional*/, [dependencies] /*optional*/, definition function /*function for instantiating the module or object*/ ); //creating a dummy module because i work with dojo i omit the module id, as it usually used for the legacy module system which i dont use anymore but i'll add it for brevity define("dummyClass",["dummyObj","name"],function(dummy,name){ //where dummyObj will map to dummyObj.js and name.js which be loaded and the result is mapped the function as a callback //now i want to return a simpe class with methods var returnedObject={ people:[{ name:"Dhtml", skills:["drupal","dhtml","php","c++","spanish language"], age:29, marital:single}, { name:"Yawatide", skills:["seo","css","html"], age:31, marital:single}] }; return returnedObject; }); //what happens is that it creates a module and returns an object upon the request assuming the file is stored in ./home/js/ in the home/index.html
i have been using this for a mobile web app and it makes sense splitting my codes in multiple files however you should read more on it as this is just a simple note on AMD infact there's a possibility my syntax might be wrong since i didn't run any jlint to check my code. take care all. |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 8:41am On Jan 08, 2012 |
What am I doing in the json output? There is a tool somewhere on my site - mycodes - that is like pastebin but can run jscript codes, html and php self. @newbies, you can use jsonlint.com to test your json - I hope url Is corecta. @op, this your thread, only pros can follow it o |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 4:08pm On Jan 08, 2012 |
for some reason the first name that comes as an example name is always ur name, even in every tutorial i have written. #nohomo |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 4:45pm On Jan 08, 2012 |
I kinda noticed, well, try break it down, i am sure you have convinced everybody except few |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 5:26pm On Jan 08, 2012 |
ok i will soon. with a simple example |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 2:30am On Jan 09, 2012 |
Now we will create a simple application called nairaland application what it does is simply list all the banned members from the Database(obviously lietral objects) but we will do it in a manner that is modular and easy to do. first create a simple html.
now we have the html file we need to download the RequireJS library for Dojo user it comes with Dojo but this is a general tutorial so no dojo involved here. link for requre.js is in requirejs.org, just dowload the require.js file now in the html add the file to the tag
|
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 2:37am On Jan 09, 2012 |
next we need to create the nairaland application so we create a js file called nairaland.js
what define does is to create a module,you have the option of passing a function if you need to setup some connections or simple as properties of the module because i want the module to just simply return an object i passed a function which returns an obj, now if you look at the first parameter it has an array argument with the name "banned", the banned refers to a dependency meaning a file that this nairaland will require before it returns the nairaland object. think of it as php include and java import. now while the files loads the result of the files is passed as a callback this is an asynchronous operation becuz we have no idea when the file will finish a callback is registered, once it finish it passes the result as an argument to the callback functions. now the banned.js will simply be a class/object/module in the first parameter, so before i explain lets create the banned class to understand what i mean. |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 2:43am On Jan 09, 2012 |
we create another banned file called banned.js
as usual we create the define to create a module, then pass a function because i dont want the nairaland class to have access to the list so i return an object with a function that returns the list data through the help of Closures. "Closure is a complicated thing to explain" but it simply refers to a variable within its execution environment, trust me not sure what that means cuz my head is tied to function only referring to local scopes and removing them from stack after the function has finished python guys can explain to you better, now our banned module will return an object with the method getBannedMember which is just a simple literal objects of keys and value. lets jump back to nairaland. |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 2:49am On Jan 09, 2012 |
because the banned file is in the same folder i just simply use the name "banned" which will translate to banned.js now our e is the result of banned.js which is our object now thanks to this pattern i no longer have to worry about my empty object being attached to Global object with no name,e is my banned returned object
so i now have access to the method with ease and this is awesome because if i wanted to change the implementation i can easily go to banned,js and change what i what. now how to use it in the html |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 2:58am On Jan 09, 2012 |
a function that would run when document is ready
this will load nairaland.js which in turn will also load banned.js dependency files are always loaded first so no more worry about the order of placing scripts like jquery users face when they boot the src below the implementation.
|
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 3:00am On Jan 09, 2012 |
//remember we need to run it so we <body onload="init()"> |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 3:02am On Jan 09, 2012 |
Screenshot
|
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 3:04am On Jan 09, 2012 |
yawn and i'm going to sleep getting my gun corked for tomorrow's protest. #occupynigeria |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 8:24pm On Jan 09, 2012 |
ehmmmm questions and answer ? |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 10:20pm On Jan 09, 2012 |
Skip the questions. Most people on this board cannot follow this thread because they don't know basic jscript. So they wil prefer to ask their questions in private. But do continue. I wil help fill in the gap later. |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 12:06am On Jan 10, 2012 |
i will continue on the next one, just trying to read for exams gosh i hate exams. |
Re: A Brief View On Asynchronous Modular Dependency Javascript by ask4all: 11:11am On Jan 19, 2012 |
Pls help me i reg to dis site today bcoz i want u people to help me develop my programming so i see dis thread and im interesting in it and i dint understand any thing u post pls i need ur help and pls and pls help me with the list of software to require for programming pls here is my email aminu.saminu@yahoo.com pls and pls *crying* *respect* God bless u all lol pls. |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 8:02pm On Jan 19, 2012 |
whoa i had forgotten about this post. ok dhtml is right people might not know basic JavaScript so where do i start from ? there are free tools everywhere just download them. if u need help you should go the extra mile to get help and not dropping email and expecting someone to answer, download dreamweaver for basic |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nobody: 9:16pm On Jan 19, 2012 |
^^^Aye, i kuku told you. . .look at the view/response ratio of the thread. Many people appreciate it, but they cant make head or tail out of it. Anyway, folks, if you are interested in learning javascript, please check out the classrooms section of my website - www..net Mehn, i hope they will not vanish the bandwidth again. . . . |
Re: A Brief View On Asynchronous Modular Dependency Javascript by Nmeri17: 10:27am On Mar 27, 2016 |
(1) (Reply)
Facebook Ads VS Google Ads / To Seun And Mod, / Professional Web Development Class
(Go Up)
Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health religion celebs tv-movies music-radio literature webmasters programming techmarket Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 38 |