Your SlideShare is downloading. ×
0
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Object Oriented JavaScript
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Object Oriented JavaScript

1,568

Published on

Published in: Technology, Self Improvement
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,568
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  1. Object Oriented JavaScript JavaScript is a flexible Embrace the principles ofand expressive language OO design and how that should be written prototypical languages like clearly and concisely. JavaScript fit into this paradigm. JavaScript is one of the cornerstones to the powerful set of tools made available by HTML5
  2. Remember Why?Just to name some of the reasons... Encapsulation Composition Inheritance Polymorphism
  3. Prototype Based LanguageNo formal class defn.Objects are prototypesInheritance through cloning ex nihilo "from nothing"
  4. Instance ObjectsBaseSoup = function() { name = "simple soup"; price = 7.00; ingredients = ["water", "salt", "mirepoix"];}BaseSoup.prototype.menuDisplay = function() { return name.concat(" ").concat(price);}var soup = new BaseSoup();soup.menuDisplay();
  5. Composition, Private Methods...BaseSoup = function() { name = "simple soup"; priceMgr = new PriceManager(); ingredients = ["water", "salt", "mirepoix"]; price = function() { return priceMgr.price(this); }}BaseSoup.prototype.menuDisplay = function() { return name.concat(" ").concat(price());}
  6. InheritanceCrabBisque = function() {};//Lets inherit from the BaseSoup object from the previous slidesCrabBisque.prototype = new BaseSoup;CrabBisque.prototype.constructor = CrabBisque;CrabBisque.prototype.parent = BaseSoup.prototype;CrabBisque.prototype.description = function() { return "Delicious crab in a rich cream broth";}var bisque = new CrabBisque();bisque.menuDisplay();
  7. Polymorphic JackpotCrabBisque = function() { name = "Crab Bisque"; ingredients = ["salt", "mirepoix", "heavy cream", "crab", "butter", "leeks", "pepper", "tomato paste"];};CrabBisque.prototype = new BaseSoup;CrabBisque.prototype.constructor = CrabBisque;CrabBisque.prototype.parent = BaseSoup.prototype;var bisque = new CrabBisque();bisque.display();bisque.description();
  8. Soup? Inspiration.
  9. call ~ superCrabBisque = function() { BaseSoup.call(this); //call the super object constructor name = "Crab Bisque"; ingredients = ["salt", "mirepoix", "heavy cream", "crab", "butter" "leeks", "pepper", "tomato paste"];};CrabBisque.prototype.description = function() { return BaseSoup.prototype.description.call(this); //call the super method}
  10. "From Nothing"var lunch = {soup: new Jambalaya(), bread: true, drink: "Coke", burp: function() { return "yum"}};
  11. Static ObjectsSoupFactory = (function() { return { serve: function(person) { switch(person.name()) { case "Newman": return new Jambalaya(); case "George": return new CrabBisque(); case "Elaine": return new Mulligatawny(); default: return new LimaBean(); } } }})();
  12. Closures / Anonymous Functions//function in a function//retains a copy of the local variable despite being an anon functionFatCat = function() { var weight = 4; this.eat = function() { weight++; }; this.weighIn = function() { alert(weight); }; this.speak = function() { kittyTalk = function() { alert(meow); } //NOTE: meow is defined _after_ the anon above...it still works! var meow = "Meeeooww"; return kittyTalk; //just got functional }}
  13. Functional Sprinkles of Goodnessfunction each(arrayOfStuff, action) { for(var i = 0; i < arrayOfStuff.length; i++) { action(arrayOfStuff[i]); }}each([1,2,3,4,5], alert);

×