SlideShare a Scribd company logo
1 of 27
function myNonClosure() {            Variable lost after
    var date = new Date();           function returns
    return date.getMilliseconds();
}
function myClosure() {           Variable stays around
var date = new Date();           even after function returns
//nested function
return function () {
     return date.getMilliseconds();
     };
}
var calc = new Calculator('eqCtl');
calc.add(2,2)
var Calculator = function() {
     //private variables
     //private functions

     return {
          //public members
     };
};
var Calculator = function(eq) {
     //private member
     var eqCtl = document.getElementById(eq);

     return {
                                      var calculator = new Calculator('eq');
           //expose public member     calculator.add(2,2)
           add: function(x,y) {
                 var val = x + y;
                 eqCtl.innerHTML = val;
                 }
           };
};
<html>
...
    <script source="first.js"></script>
    <script source="second.js"></script>
</html>


// first.js
(function(ns) {                                      // second.js
            ns.Customer = function() {               (function(ns) {
                    this.name = "";                           ns.Order = function() { ... };
            };                                       }(window.WilderMinds = window.WilderMinds || {}));
}(window.WilderMinds = window.WilderMinds || {}));
<!DOCTYPE html>
<html lang="en">
<head>
         <meta charset="utf-8">
         <title>RequireJS</title>
</head>
<body>
         <script src="scripts/require.js" data-main="scripts/lib/main.js">
         </script>
</body>
</html>
// main.js
require(["Customer"],
       // Requires the Customer Module
       function (Customer) { // Call with required Module(s)
              // Your Initialization Code
              var c = new Customer("A Customer");
              var name = c.name;
       }
 );
// Customer.js
define( [], // Required Scripts (None)
       function(){
       // Gets any required modules here like main
       function Customer (name) {
                this.name = name
       }
       return Customer; // Return the object that Requires
                          //constructor to allow you to call it
}
Suresh.Balla@neudesic.com

More Related Content

What's hot

Why You Shouldn't Write OO
Why You Shouldn't Write OO Why You Shouldn't Write OO
Why You Shouldn't Write OO
Yehuda Katz
 

What's hot (18)

Functional Reactive Programming - RxSwift
Functional Reactive Programming - RxSwiftFunctional Reactive Programming - RxSwift
Functional Reactive Programming - RxSwift
 
16 18
16 1816 18
16 18
 
Hack tutorial
Hack tutorialHack tutorial
Hack tutorial
 
React with Redux
React with ReduxReact with Redux
React with Redux
 
React, Redux, ES2015 by Max Petruck
React, Redux, ES2015   by Max PetruckReact, Redux, ES2015   by Max Petruck
React, Redux, ES2015 by Max Petruck
 
Reactивная тяга
Reactивная тягаReactивная тяга
Reactивная тяга
 
Reactive Programming Patterns with RxSwift
Reactive Programming Patterns with RxSwiftReactive Programming Patterns with RxSwift
Reactive Programming Patterns with RxSwift
 
Net/http and the http.handler interface
Net/http and the http.handler interfaceNet/http and the http.handler interface
Net/http and the http.handler interface
 
Testing in JavaScript
Testing in JavaScriptTesting in JavaScript
Testing in JavaScript
 
Testando API's de forma unitária mocando as dependências
Testando API's de forma unitária mocando as dependênciasTestando API's de forma unitária mocando as dependências
Testando API's de forma unitária mocando as dependências
 
React и redux
React и reduxReact и redux
React и redux
 
Demoiselle 2.0 no JavaOne Brasil 2010
Demoiselle 2.0 no JavaOne Brasil 2010Demoiselle 2.0 no JavaOne Brasil 2010
Demoiselle 2.0 no JavaOne Brasil 2010
 
mediator
mediatormediator
mediator
 
Magento2&amp;java script (2)
Magento2&amp;java script (2)Magento2&amp;java script (2)
Magento2&amp;java script (2)
 
Why You Shouldn't Write OO
Why You Shouldn't Write OO Why You Shouldn't Write OO
Why You Shouldn't Write OO
 
Async js - Nemetschek Presentaion @ HackBulgaria
Async js - Nemetschek Presentaion @ HackBulgariaAsync js - Nemetschek Presentaion @ HackBulgaria
Async js - Nemetschek Presentaion @ HackBulgaria
 
Promises, promises, and then observables
Promises, promises, and then observablesPromises, promises, and then observables
Promises, promises, and then observables
 
AngulrJS Overview
AngulrJS OverviewAngulrJS Overview
AngulrJS Overview
 

Viewers also liked (8)

Html5 Canvas and Media
Html5 Canvas and MediaHtml5 Canvas and Media
Html5 Canvas and Media
 
React native - Under the Hood and App Live Updates without App Store Approval
React native - Under the Hood and App Live Updates without App Store ApprovalReact native - Under the Hood and App Live Updates without App Store Approval
React native - Under the Hood and App Live Updates without App Store Approval
 
Developing context aware applications with iBeacons technology
Developing context aware applications with iBeacons technologyDeveloping context aware applications with iBeacons technology
Developing context aware applications with iBeacons technology
 
The Influence Of The Media Ppp
The Influence Of The Media PppThe Influence Of The Media Ppp
The Influence Of The Media Ppp
 
Filsafat islam
Filsafat islamFilsafat islam
Filsafat islam
 
Au Psy492 M7 A3 E Portf Lee C
Au Psy492 M7 A3 E Portf Lee CAu Psy492 M7 A3 E Portf Lee C
Au Psy492 M7 A3 E Portf Lee C
 
Digital connections- Disease Vocab
Digital connections- Disease VocabDigital connections- Disease Vocab
Digital connections- Disease Vocab
 
Ad. New Deodorants
Ad. New DeodorantsAd. New Deodorants
Ad. New Deodorants
 

Similar to Architecting JavaScript Code

HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6
HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6
HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6
Dmitry Soshnikov
 

Similar to Architecting JavaScript Code (20)

Introduction to Zend Framework web services
Introduction to Zend Framework web servicesIntroduction to Zend Framework web services
Introduction to Zend Framework web services
 
Javascript - Beyond-jQuery
Javascript - Beyond-jQueryJavascript - Beyond-jQuery
Javascript - Beyond-jQuery
 
What's new in jQuery 1.5
What's new in jQuery 1.5What's new in jQuery 1.5
What's new in jQuery 1.5
 
Ten useful JavaScript tips & best practices
Ten useful JavaScript tips & best practicesTen useful JavaScript tips & best practices
Ten useful JavaScript tips & best practices
 
Symfony2 Building on Alpha / Beta technology
Symfony2 Building on Alpha / Beta technologySymfony2 Building on Alpha / Beta technology
Symfony2 Building on Alpha / Beta technology
 
Symfony2 from the Trenches
Symfony2 from the TrenchesSymfony2 from the Trenches
Symfony2 from the Trenches
 
Clean Javascript
Clean JavascriptClean Javascript
Clean Javascript
 
TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript Introduction
 
Zend framework service
Zend framework serviceZend framework service
Zend framework service
 
Zend framework service
Zend framework serviceZend framework service
Zend framework service
 
Object-Oriented JavaScript
Object-Oriented JavaScriptObject-Oriented JavaScript
Object-Oriented JavaScript
 
Object-Oriented Javascript
Object-Oriented JavascriptObject-Oriented Javascript
Object-Oriented Javascript
 
Virtual Madness @ Etsy
Virtual Madness @ EtsyVirtual Madness @ Etsy
Virtual Madness @ Etsy
 
ZF2 for the ZF1 Developer
ZF2 for the ZF1 DeveloperZF2 for the ZF1 Developer
ZF2 for the ZF1 Developer
 
Doctrine For Beginners
Doctrine For BeginnersDoctrine For Beginners
Doctrine For Beginners
 
Clean code in JavaScript
Clean code in JavaScriptClean code in JavaScript
Clean code in JavaScript
 
HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6
HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6
HelsinkiJS meet-up. Dmitry Soshnikov - ECMAScript 6
 
Ad java prac sol set
Ad java prac sol setAd java prac sol set
Ad java prac sol set
 
Backbone Basics with Examples
Backbone Basics with ExamplesBackbone Basics with Examples
Backbone Basics with Examples
 
Google App Engine Developer - Day3
Google App Engine Developer - Day3Google App Engine Developer - Day3
Google App Engine Developer - Day3
 

Recently uploaded

Powerful kala ilam, Black magic specialist in Dubai and Kala jadu expert in ...
Powerful kala ilam, Black magic specialist in Dubai and  Kala jadu expert in ...Powerful kala ilam, Black magic specialist in Dubai and  Kala jadu expert in ...
Powerful kala ilam, Black magic specialist in Dubai and Kala jadu expert in ...
makhmalhalaaay
 
Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...
Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...
Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...
makhmalhalaaay
 
Amazing Grace - John Newton (Hymn) PPTX-Worship v1.pptx
Amazing Grace - John Newton (Hymn) PPTX-Worship v1.pptxAmazing Grace - John Newton (Hymn) PPTX-Worship v1.pptx
Amazing Grace - John Newton (Hymn) PPTX-Worship v1.pptx
JessalynArancoSalvac
 
Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...
Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...
Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...
baharayali
 
Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...
Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...
Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...
baharayali
 
Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...
Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...
Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...
baharayali
 
Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...
Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...
Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...
baharayali
 
Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...
Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...
Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...
baharayali
 
Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...
Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...
Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...
baharayali
 
Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...
Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...
Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...
makhmalhalaaay
 
#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...
#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...
#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...
Baba Mkuru
 

Recently uploaded (20)

Independent Zodiac Embracing The Single Life
Independent Zodiac Embracing The Single LifeIndependent Zodiac Embracing The Single Life
Independent Zodiac Embracing The Single Life
 
Powerful kala ilam, Black magic specialist in Dubai and Kala jadu expert in ...
Powerful kala ilam, Black magic specialist in Dubai and  Kala jadu expert in ...Powerful kala ilam, Black magic specialist in Dubai and  Kala jadu expert in ...
Powerful kala ilam, Black magic specialist in Dubai and Kala jadu expert in ...
 
Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...
Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...
Genuine kala ilam, Kala jadu specialist in Dubai and Black magic expert in Du...
 
amil baba in uk-top amil baba-asli amil baba kala jadu amil baba top 10 amil ...
amil baba in uk-top amil baba-asli amil baba kala jadu amil baba top 10 amil ...amil baba in uk-top amil baba-asli amil baba kala jadu amil baba top 10 amil ...
amil baba in uk-top amil baba-asli amil baba kala jadu amil baba top 10 amil ...
 
Amazing Grace - John Newton (Hymn) PPTX-Worship v1.pptx
Amazing Grace - John Newton (Hymn) PPTX-Worship v1.pptxAmazing Grace - John Newton (Hymn) PPTX-Worship v1.pptx
Amazing Grace - John Newton (Hymn) PPTX-Worship v1.pptx
 
English - The Book of Exodus the Second Book of Moses.pdf
English - The Book of Exodus the Second Book of Moses.pdfEnglish - The Book of Exodus the Second Book of Moses.pdf
English - The Book of Exodus the Second Book of Moses.pdf
 
The_Chronological_Life_of_Christ_Part_101_Misordered_Priorities
The_Chronological_Life_of_Christ_Part_101_Misordered_PrioritiesThe_Chronological_Life_of_Christ_Part_101_Misordered_Priorities
The_Chronological_Life_of_Christ_Part_101_Misordered_Priorities
 
Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...
Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...
Worldwide kala ilam, Black magic specialist in Pakistan Or Kala jadu expert i...
 
Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...
Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...
Authentic black magic, Kala jadu expert in Karachi and Kala ilam expert in Si...
 
The Spiritist Prayers - By Cairbar Schutel
The Spiritist Prayers - By Cairbar SchutelThe Spiritist Prayers - By Cairbar Schutel
The Spiritist Prayers - By Cairbar Schutel
 
Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...
Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...
Famous Kala ilam, Black magic specialist in India Or kala jadu taweez for lov...
 
Bible-quiz from the book of Ezekiel and John
Bible-quiz from the book of Ezekiel and JohnBible-quiz from the book of Ezekiel and John
Bible-quiz from the book of Ezekiel and John
 
Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...
Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...
Topmost black magic, Bangali Amil baba in Lahore and Kala jadu specialist in ...
 
English - The Book of Leviticus the Third Book of Moses.pdf
English - The Book of Leviticus the Third Book of Moses.pdfEnglish - The Book of Leviticus the Third Book of Moses.pdf
English - The Book of Leviticus the Third Book of Moses.pdf
 
Kala ilam, Black magic specialist in Lahore +923338228883 Kala ilam expert in...
Kala ilam, Black magic specialist in Lahore +923338228883 Kala ilam expert in...Kala ilam, Black magic specialist in Lahore +923338228883 Kala ilam expert in...
Kala ilam, Black magic specialist in Lahore +923338228883 Kala ilam expert in...
 
Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...
Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...
Popular black magic, Black magic specialist in Pakistan Or Kala jadu expert i...
 
Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...
Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...
Authentic black magic, Amil baba specialist Oman Or Bangali Amil baba expert ...
 
Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...
Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...
Powerful black magic, Bangali Amil baba in Rawalpindi and Kala jadu specialis...
 
Gongregation Tehillah Journal of 2024 GALA
Gongregation Tehillah Journal of 2024 GALAGongregation Tehillah Journal of 2024 GALA
Gongregation Tehillah Journal of 2024 GALA
 
#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...
#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...
#1 PREGNANCY SPELL WITH NO SIDE EFFECT TO HAVE KIDS CALL +277-99-215634 IN US...
 

Architecting JavaScript Code

  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8. function myNonClosure() { Variable lost after var date = new Date(); function returns return date.getMilliseconds(); }
  • 9. function myClosure() { Variable stays around var date = new Date(); even after function returns //nested function return function () { return date.getMilliseconds(); }; }
  • 10.
  • 11.
  • 12. var calc = new Calculator('eqCtl'); calc.add(2,2)
  • 13.
  • 14.
  • 15.
  • 16. var Calculator = function() { //private variables //private functions return { //public members }; };
  • 17. var Calculator = function(eq) { //private member var eqCtl = document.getElementById(eq); return { var calculator = new Calculator('eq'); //expose public member calculator.add(2,2) add: function(x,y) { var val = x + y; eqCtl.innerHTML = val; } }; };
  • 18.
  • 19.
  • 20. <html> ... <script source="first.js"></script> <script source="second.js"></script> </html> // first.js (function(ns) { // second.js ns.Customer = function() { (function(ns) { this.name = ""; ns.Order = function() { ... }; }; }(window.WilderMinds = window.WilderMinds || {})); }(window.WilderMinds = window.WilderMinds || {}));
  • 21.
  • 22. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>RequireJS</title> </head> <body> <script src="scripts/require.js" data-main="scripts/lib/main.js"> </script> </body> </html>
  • 23. // main.js require(["Customer"], // Requires the Customer Module function (Customer) { // Call with required Module(s) // Your Initialization Code var c = new Customer("A Customer"); var name = c.name; } );
  • 24. // Customer.js define( [], // Required Scripts (None) function(){ // Gets any required modules here like main function Customer (name) { this.name = name } return Customer; // Return the object that Requires //constructor to allow you to call it }
  • 25.
  • 26.

Editor's Notes

  1. HTML5 JavaScript codeTraditional ASP.NET vs ASP.NET MVCLoad views first and get all data – talk about Windows Azure Preview Portal, pivotal trackeretcSPAWindows 8 WinRT with HTML and JavaScript
  2. C:\\Users\\Suresh.Balla\\Desktop\\Win8\\Html5Demos\\2 - advanced\\C-RectanglesWithCircles.html
  3. C:\\Users\\Suresh.Balla\\Desktop\\Win8\\Html5Demos\\2 - advanced\\C-RectanglesWithCircles.html