Your SlideShare is downloading. ×
Object Oriented Programming in js
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 Programming in js

494
views

Published on

Principles of Object Oriented Programming in js …

Principles of Object Oriented Programming in js

for short, #pooping in js.

Published in: Technology

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
494
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
5
Comments
0
Likes
2
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
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript

    • 1. Object Oriented ProgrammingSunil Pai, Y!
    • 2. Objects
    • 3. Objects and Javascript
    • 4. Numbers Strings BooleansObjects and Javascript Regexps Functions Arrays Objects
    • 5. 3.141 Numbers 1.4e20 0xff3322 Strings BooleansObjects and Javascript Regexps Functions Arrays Objects
    • 6. Numbers “the lazy dog” Strings “123” “1” + 1 BooleansObjects and Javascript Regexps Functions Arrays Objects
    • 7. Numbers Strings true Booleans falseObjects and Javascript Regexps Functions Arrays Objects
    • 8. Numbers Strings BooleansObjects and Javascript Regexps /[A-Za-z0-9]/gm Functions Arrays Objects
    • 9. Numbers Strings BooleansObjects and Javascript Regexps function(p1, p2){ // do something Functions // with p1, p2 return p1 + p2 } Arrays Objects
    • 10. Numbers Strings BooleansObjects and Javascript Regexps Functions Arrays [ 1, ‘abc’, 2.4 ] Objects
    • 11. Numbers Strings BooleansObjects and Javascript Regexps Functions Arrays { x: 200, Objects y: 164, theta: 20 }
    • 12. nullObjects and Javascript undefined
    • 13. Javascript hassuperpowers
    • 14. functions are objectsJavascript has closuressuperpowers .prototype
    • 15. functions are objectsJavascript has closuressuperpowers .prototype
    • 16. functions are objectsJavascript has closuressuperpowers .prototype
    • 17. functions are objectsJavascript has closuressuperpowers .prototype
    • 18. OOP:First PrinciplesConstructorsAbstractionInheritanceEncapsulationPolymorphism
    • 19. OOP:First Principles function Shirt(owner){ this.owner = owner } Shirt.prototype.iron=function(){ this.ironed = trueConstructors } var myShirt = new Shirt(‘pi’)Abstraction // myShirt.owner === ‘pi’ myShirt.iron()Inheritance // myShirt.ironed === trueEncapsulationPolymorphism
    • 20. OOP:First PrinciplesConstructors Shirt (new) .iron()Abstraction .wash() .ironed // true/false .age // numberInheritanceEncapsulationPolymorphism
    • 21. OOP:First PrinciplesConstructors var Kurta = extends(Shirt)Abstraction Kurta.prototype.wash = function(){ Shirt.prototype.wash.apply(this,Inheritance arguments); // and make sure the water’s cold!Encapsulation }Polymorphism
    • 22. var __hasProp = {}.hasOwnPropertyOOP: var extends = function(child, parent) { for (var key in parent) {First Principles if (__hasProp.call(parent, key)) { child[key] = parent[key] } } function Ctor() { this.constructor = child } Ctor.prototype = parent.prototype child.prototype = new Ctor()Constructors child.superclass = parent.prototype return child }Abstraction var Kurta = extends(Shirt)Inheritance Kurta.prototype.wash = function(){ Shirt.prototype }EncapsulationPolymorphism
    • 23. OOP:First PrinciplesConstructorsAbstraction var ctr = (function(){ var i = 0 return function(){Inheritance return i++ } })()Encapsulation ctr() // 0 ctr() // 1Polymorphism ctr() // 2 // and so on
    • 24. OOP:First PrinciplesConstructorsAbstractionInheritance // make do with runtime objectEncapsulation // manipulation, “arguments” myShirt.iron = function(x, y){Polymorphism x === arguments[0] // true y === arguments[1] // true var z = arguments[3] // doop de doo }
    • 25. ( Demo )
    • 26. sidenote: MVC
    • 27. sidenote: modules
    • 28. sidenote: frameworks
    • 29. sidenote: other common patterns
    • 30. Questions?
    • 31. Party on, dudes. @threepointone

    ×