SlideShare una empresa de Scribd logo
1 de 31
Object Oriented Programming
Sunil Pai, Y!
Objects
Objects and Javascript
Numbers

                         Strings

                         Booleans

Objects and Javascript   Regexps

                         Functions

                         Arrays

                         Objects
3.141

                         Numbers     1.4e20
                                     0xff3322

                         Strings

                         Booleans

Objects and Javascript   Regexps

                         Functions

                         Arrays

                         Objects
Numbers
                                     “the lazy dog”

                         Strings     “123”
                                     “1” + 1

                         Booleans

Objects and Javascript   Regexps

                         Functions

                         Arrays

                         Objects
Numbers

                         Strings
                                     true
                         Booleans
                                     false


Objects and Javascript   Regexps

                         Functions

                         Arrays

                         Objects
Numbers

                         Strings

                         Booleans

Objects and Javascript   Regexps     /[A-Za-z0-9]/gm



                         Functions

                         Arrays

                         Objects
Numbers

                         Strings

                         Booleans

Objects and Javascript   Regexps
                                     function(p1, p2){
                                       // do something
                         Functions     // with p1, p2
                                       return p1 + p2
                                     }
                         Arrays

                         Objects
Numbers

                         Strings

                         Booleans

Objects and Javascript   Regexps

                         Functions

                         Arrays      [ 1, ‘abc’, 2.4 ]



                         Objects
Numbers

                         Strings

                         Booleans

Objects and Javascript   Regexps

                         Functions

                         Arrays
                                     {
                                         x: 200,
                         Objects         y: 164,
                                         theta: 20
                                     }
null
Objects and Javascript
                         undefined
Javascript has
superpowers
functions are objects


Javascript has
                 closures
superpowers

                 .prototype
functions are objects


Javascript has
                 closures
superpowers

                 .prototype
functions are objects


Javascript has
                 closures
superpowers

                 .prototype
functions are objects


Javascript has
                 closures
superpowers

                 .prototype
OOP:
First Principles


Constructors

Abstraction

Inheritance

Encapsulation

Polymorphism
OOP:
First Principles   function Shirt(owner){
                     this.owner = owner
                   }

                   Shirt.prototype.iron=function(){
                     this.ironed = true
Constructors       }

                   var myShirt = new Shirt(‘pi’)
Abstraction        // myShirt.owner === ‘pi’

                   myShirt.iron()
Inheritance        // myShirt.ironed === true



Encapsulation

Polymorphism
OOP:
First Principles


Constructors       Shirt
                     (new)
                     .iron()
Abstraction          .wash()
                     .ironed // true/false
                     .age // number
Inheritance

Encapsulation

Polymorphism
OOP:
First Principles


Constructors

                   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
var __hasProp = {}.hasOwnProperty


OOP:
                   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
                       }
Encapsulation

Polymorphism
OOP:
First Principles


Constructors

Abstraction        var ctr = (function(){
                       var i = 0
                       return function(){
Inheritance               return i++
                       }
                   })()
Encapsulation
                   ctr() // 0
                   ctr() // 1
Polymorphism       ctr() // 2

                   // and so on
OOP:
First Principles


Constructors

Abstraction

Inheritance
                   // make do with runtime object
Encapsulation      // manipulation, “arguments”

                   myShirt.iron = function(x, y){
Polymorphism         x === arguments[0] // true
                     y === arguments[1] // true
                     var z = arguments[3]
                     // doop de doo
                   }
( Demo )
sidenote: MVC
sidenote: modules
sidenote: frameworks
sidenote: other common patterns
Questions?
Party on, dudes.


   @threepointone

Más contenido relacionado

La actualidad más candente

深入浅出Jscex
深入浅出Jscex深入浅出Jscex
深入浅出Jscex
jeffz
 
Jscex: Write Sexy JavaScript
Jscex: Write Sexy JavaScriptJscex: Write Sexy JavaScript
Jscex: Write Sexy JavaScript
jeffz
 
Scala 2013 review
Scala 2013 reviewScala 2013 review
Scala 2013 review
Sagie Davidovich
 
Jscex: Write Sexy JavaScript (中文)
Jscex: Write Sexy JavaScript (中文)Jscex: Write Sexy JavaScript (中文)
Jscex: Write Sexy JavaScript (中文)
jeffz
 
6.1.1一步一步学repast代码解释
6.1.1一步一步学repast代码解释6.1.1一步一步学repast代码解释
6.1.1一步一步学repast代码解释
zhang shuren
 

La actualidad más candente (20)

Coding in Style
Coding in StyleCoding in Style
Coding in Style
 
Suit case class
Suit case classSuit case class
Suit case class
 
What is String in Java?
What is String in Java?What is String in Java?
What is String in Java?
 
响应式编程及框架
响应式编程及框架响应式编程及框架
响应式编程及框架
 
Prototype
PrototypePrototype
Prototype
 
Core What?
Core What?Core What?
Core What?
 
Introduction to functional programming using Ocaml
Introduction to functional programming using OcamlIntroduction to functional programming using Ocaml
Introduction to functional programming using Ocaml
 
The many facets of code reuse in JavaScript
The many facets of code reuse in JavaScriptThe many facets of code reuse in JavaScript
The many facets of code reuse in JavaScript
 
Week 06 Modular Javascript_Brandon, S. H. Wu
Week 06 Modular Javascript_Brandon, S. H. WuWeek 06 Modular Javascript_Brandon, S. H. Wu
Week 06 Modular Javascript_Brandon, S. H. Wu
 
深入浅出Jscex
深入浅出Jscex深入浅出Jscex
深入浅出Jscex
 
Jscex: Write Sexy JavaScript
Jscex: Write Sexy JavaScriptJscex: Write Sexy JavaScript
Jscex: Write Sexy JavaScript
 
Hey! There's OCaml in my Rust!
Hey! There's OCaml in my Rust!Hey! There's OCaml in my Rust!
Hey! There's OCaml in my Rust!
 
Functional Programming in C++
Functional Programming in C++Functional Programming in C++
Functional Programming in C++
 
Scala 2013 review
Scala 2013 reviewScala 2013 review
Scala 2013 review
 
Javascript foundations: Introducing OO
Javascript foundations: Introducing OOJavascript foundations: Introducing OO
Javascript foundations: Introducing OO
 
[JuraSIC! Meetup] Mateusz Stasch - Monady w .NET
[JuraSIC! Meetup] Mateusz Stasch - Monady w .NET[JuraSIC! Meetup] Mateusz Stasch - Monady w .NET
[JuraSIC! Meetup] Mateusz Stasch - Monady w .NET
 
Jscex: Write Sexy JavaScript (中文)
Jscex: Write Sexy JavaScript (中文)Jscex: Write Sexy JavaScript (中文)
Jscex: Write Sexy JavaScript (中文)
 
Using Reflections and Automatic Code Generation
Using Reflections and Automatic Code GenerationUsing Reflections and Automatic Code Generation
Using Reflections and Automatic Code Generation
 
EROSについて
EROSについてEROSについて
EROSについて
 
6.1.1一步一步学repast代码解释
6.1.1一步一步学repast代码解释6.1.1一步一步学repast代码解释
6.1.1一步一步学repast代码解释
 

Destacado

Locate your hacks - Open Hack 2012 India
Locate your hacks - Open Hack 2012 IndiaLocate your hacks - Open Hack 2012 India
Locate your hacks - Open Hack 2012 India
threepointone
 
Amplify your stack - Jsfoo pune 2012
Amplify your stack - Jsfoo pune 2012Amplify your stack - Jsfoo pune 2012
Amplify your stack - Jsfoo pune 2012
threepointone
 
SwitchOn! Vol.1 WebDesign
SwitchOn! Vol.1 WebDesignSwitchOn! Vol.1 WebDesign
SwitchOn! Vol.1 WebDesign
kazuko kaneuchi
 
Видеоконференции - новое качество общения, Макаров, CNews
Видеоконференции - новое качество общения,  Макаров, CNewsВидеоконференции - новое качество общения,  Макаров, CNews
Видеоконференции - новое качество общения, Макаров, CNews
Stanislav Makarov
 

Destacado (11)

Locate your hacks
Locate your hacksLocate your hacks
Locate your hacks
 
the rabbit and the tortoise
the rabbit and the tortoisethe rabbit and the tortoise
the rabbit and the tortoise
 
Locate your hacks - Open Hack 2012 India
Locate your hacks - Open Hack 2012 IndiaLocate your hacks - Open Hack 2012 India
Locate your hacks - Open Hack 2012 India
 
Amplify your stack - Jsfoo pune 2012
Amplify your stack - Jsfoo pune 2012Amplify your stack - Jsfoo pune 2012
Amplify your stack - Jsfoo pune 2012
 
Wide Open Faces
Wide Open FacesWide Open Faces
Wide Open Faces
 
Tipografia Cicero Giovany - Paulo Czar
Tipografia   Cicero Giovany - Paulo CzarTipografia   Cicero Giovany - Paulo Czar
Tipografia Cicero Giovany - Paulo Czar
 
Font type identification of hindi printed document
Font type identification of hindi printed documentFont type identification of hindi printed document
Font type identification of hindi printed document
 
How to add Custom Font to your iOS-based App?
How to add Custom Font to your iOS-based App?How to add Custom Font to your iOS-based App?
How to add Custom Font to your iOS-based App?
 
SwitchOn! Vol.1 WebDesign
SwitchOn! Vol.1 WebDesignSwitchOn! Vol.1 WebDesign
SwitchOn! Vol.1 WebDesign
 
Видеоконференции - новое качество общения, Макаров, CNews
Видеоконференции - новое качество общения,  Макаров, CNewsВидеоконференции - новое качество общения,  Макаров, CNews
Видеоконференции - новое качество общения, Макаров, CNews
 
Study: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving CarsStudy: The Future of VR, AR and Self-Driving Cars
Study: The Future of VR, AR and Self-Driving Cars
 

Similar a Object Oriented Programming in js

Qtprealtimescripts 110103234828-phpapp02
Qtprealtimescripts 110103234828-phpapp02Qtprealtimescripts 110103234828-phpapp02
Qtprealtimescripts 110103234828-phpapp02
Pavan Kokkiripati
 
Qtp realtime scripts
Qtp realtime scriptsQtp realtime scripts
Qtp realtime scripts
Ramu Palanki
 
AngularJS CheatSheet
AngularJS CheatSheetAngularJS CheatSheet
AngularJS CheatSheet
Abdul Basit
 
舒舒服服的写Javascript
舒舒服服的写Javascript舒舒服服的写Javascript
舒舒服服的写Javascript
fangdeng
 
舒舒服服的写Java script
舒舒服服的写Java script舒舒服服的写Java script
舒舒服服的写Java script
fangdeng
 

Similar a Object Oriented Programming in js (20)

Javascript
JavascriptJavascript
Javascript
 
An introduction to javascript
An introduction to javascriptAn introduction to javascript
An introduction to javascript
 
Javascript Objects Deep Dive
Javascript Objects Deep DiveJavascript Objects Deep Dive
Javascript Objects Deep Dive
 
Qtprealtimescripts 110103234828-phpapp02
Qtprealtimescripts 110103234828-phpapp02Qtprealtimescripts 110103234828-phpapp02
Qtprealtimescripts 110103234828-phpapp02
 
Qtp realtime scripts
Qtp realtime scriptsQtp realtime scripts
Qtp realtime scripts
 
Code craftsmanship saturdays second session
Code craftsmanship saturdays second sessionCode craftsmanship saturdays second session
Code craftsmanship saturdays second session
 
Ajaxworld
AjaxworldAjaxworld
Ajaxworld
 
Scala coated JVM
Scala coated JVMScala coated JVM
Scala coated JVM
 
AngularJS CheatSheet
AngularJS CheatSheetAngularJS CheatSheet
AngularJS CheatSheet
 
Javascript closures
Javascript closures Javascript closures
Javascript closures
 
JavaScript Essentials
JavaScript EssentialsJavaScript Essentials
JavaScript Essentials
 
JavaScript Programming
JavaScript ProgrammingJavaScript Programming
JavaScript Programming
 
GDSC NED Frontend Bootcamp Session 1.pptx
GDSC NED Frontend Bootcamp Session 1.pptxGDSC NED Frontend Bootcamp Session 1.pptx
GDSC NED Frontend Bootcamp Session 1.pptx
 
Getting Started With Scala
Getting Started With ScalaGetting Started With Scala
Getting Started With Scala
 
Getting Started With Scala
Getting Started With ScalaGetting Started With Scala
Getting Started With Scala
 
Oo
OoOo
Oo
 
舒舒服服的写Javascript
舒舒服服的写Javascript舒舒服服的写Javascript
舒舒服服的写Javascript
 
舒舒服服的写Java script
舒舒服服的写Java script舒舒服服的写Java script
舒舒服服的写Java script
 
Introduction to Client-Side Javascript
Introduction to Client-Side JavascriptIntroduction to Client-Side Javascript
Introduction to Client-Side Javascript
 
Core concepts-javascript
Core concepts-javascriptCore concepts-javascript
Core concepts-javascript
 

Último

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Último (20)

How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 

Object Oriented Programming in js

Notas del editor

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n
  30. \n
  31. \n