SlideShare uma empresa Scribd logo
1 de 77
Baixar para ler offline
JavaScript
                           The prototype Property




Thursday, November 1, 12
Brief


                           What’s OOP?

                           JavaScript OOP

                           Prototype

                           Inheritance




Thursday, November 1, 12
What’s OOP?
                              Introducir a OOP
                           Presentar el vocabulario




Thursday, November 1, 12
Object Oriented Programming




Thursday, November 1, 12
Programming paradigm




Thursday, November 1, 12
Data abstraction

                           Encapsulation

                           Messaging

                           Modularity

                           Polymorphism

                           Inheritance


Thursday, November 1, 12
Use object based on the real
                        world




Thursday, November 1, 12
Class vs Object




Thursday, November 1, 12
Class

                           A Class defines Objects

                           Properties
                               An object characteristic, such as color


                           Methods
                               An object capability, such as walk




Thursday, November 1, 12
Objects

                           A instance of a Class

                           Share properties and behavior

                           Unique




Thursday, November 1, 12
Class




Thursday, November 1, 12
Class




                Object1

Thursday, November 1, 12
Class




                Object1    Object2

Thursday, November 1, 12
Class




                Object1    Object2   Object3

Thursday, November 1, 12
Exercise




Thursday, November 1, 12
JavaScript OOP
                            Aplicar JavaScript OOP




Thursday, November 1, 12
JavaScript is a
                           prototypal language



Thursday, November 1, 12
Prototype-based
                                 programming
                           Class free

                           Classes are not present

                           Not Object Oriented

                           Everything is public

                           Objects inherits from another objects



Thursday, November 1, 12
Objects in JavaScript




Thursday, November 1, 12
Everything is an object




Thursday, November 1, 12
Arrays




                    Everything is an object




Thursday, November 1, 12
Arrays
                                    Dates


                    Everything is an object




Thursday, November 1, 12
Arrays
                                    Dates


                    Everything is an object

                                    Objects



Thursday, November 1, 12
Arrays
                                          Dates


                    Everything is an object

                                          Objects

                                Strings
Thursday, November 1, 12
Arrays
                                          Dates


                    Everything is an object

               Numbers                    Objects

                                Strings
Thursday, November 1, 12
They have methods and
                          properties



Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Custom Objects




Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Not reuse




Thursday, November 1, 12
Not reuse




                            Unique




Thursday, November 1, 12
Not reuse

                           Singleton
                            Pattern

                                 Unique




Thursday, November 1, 12
Exercise




Thursday, November 1, 12
Constructors




Thursday, November 1, 12
Constructor
                           Functions

                           Classes

                           Create diferents instances ==> Objects

                           Use new operator

                           Accepts parameters

                           Returns an instance ==> Object


Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Constructor
                           Has properties and methods

                             length

                             constructor

                             apply()

                             call()

                             prototype


Thursday, November 1, 12
Thursday, November 1, 12
Prototype




Thursday, November 1, 12
Prototype

                           A property

                           Defines properties and methods to all
                           instances

                           Works with new operator

                           Stored in the memory once

                           Contain an Object

                             initial value === empty Object === {}
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Inheritance




Thursday, November 1, 12
Inheritance
                           A new “class” is created from another “class”

                           Extends functionality

                           Defines new attributes and methods

                           A way to reuse code

                           All Object inherit from Object.prototype

                           12+ ways to inherits in JS


Thursday, November 1, 12
Prototype Chaining
                                Pseudo-clasical




Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Thursday, November 1, 12
Inherited




Thursday, November 1, 12
Inherited




Thursday, November 1, 12
Own




Thursday, November 1, 12
The End




Thursday, November 1, 12

Mais conteúdo relacionado

Destaque

2012 oct-12 - java script inheritance
2012 oct-12 - java script inheritance2012 oct-12 - java script inheritance
2012 oct-12 - java script inheritancepedro.carvalho
 
Javascript foundations: Inheritance
Javascript foundations: InheritanceJavascript foundations: Inheritance
Javascript foundations: InheritanceJohn Hunter
 
Basic inheritance in JavaScript
Basic inheritance in JavaScriptBasic inheritance in JavaScript
Basic inheritance in JavaScriptBrian Moschel
 
03. Introduccion a JavaScript y JQuery
03. Introduccion a JavaScript y JQuery03. Introduccion a JavaScript y JQuery
03. Introduccion a JavaScript y JQueryDanae Aguilar Guzmán
 
JavaScript and Internet Controlled Hardware Prototyping
JavaScript and Internet Controlled Hardware PrototypingJavaScript and Internet Controlled Hardware Prototyping
JavaScript and Internet Controlled Hardware PrototypingJonathan LeBlanc
 
libGDX: Screens, Fonts and Preferences
libGDX: Screens, Fonts and PreferenceslibGDX: Screens, Fonts and Preferences
libGDX: Screens, Fonts and PreferencesJussi Pohjolainen
 
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)raja kvk
 
Javascript Prototype Visualized
Javascript Prototype VisualizedJavascript Prototype Visualized
Javascript Prototype Visualized军 沈
 
Modern JavaScript Applications: Design Patterns
Modern JavaScript Applications: Design PatternsModern JavaScript Applications: Design Patterns
Modern JavaScript Applications: Design PatternsVolodymyr Voytyshyn
 

Destaque (13)

JavaScript Inheritence
JavaScript  InheritenceJavaScript  Inheritence
JavaScript Inheritence
 
New ES6 Hotness
New ES6 HotnessNew ES6 Hotness
New ES6 Hotness
 
2012 oct-12 - java script inheritance
2012 oct-12 - java script inheritance2012 oct-12 - java script inheritance
2012 oct-12 - java script inheritance
 
Javascript foundations: Inheritance
Javascript foundations: InheritanceJavascript foundations: Inheritance
Javascript foundations: Inheritance
 
JavaScript Inheritance
JavaScript InheritanceJavaScript Inheritance
JavaScript Inheritance
 
Basic inheritance in JavaScript
Basic inheritance in JavaScriptBasic inheritance in JavaScript
Basic inheritance in JavaScript
 
03. Introduccion a JavaScript y JQuery
03. Introduccion a JavaScript y JQuery03. Introduccion a JavaScript y JQuery
03. Introduccion a JavaScript y JQuery
 
JavaScript and Internet Controlled Hardware Prototyping
JavaScript and Internet Controlled Hardware PrototypingJavaScript and Internet Controlled Hardware Prototyping
JavaScript and Internet Controlled Hardware Prototyping
 
Advanced JavaScript
Advanced JavaScriptAdvanced JavaScript
Advanced JavaScript
 
libGDX: Screens, Fonts and Preferences
libGDX: Screens, Fonts and PreferenceslibGDX: Screens, Fonts and Preferences
libGDX: Screens, Fonts and Preferences
 
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
 
Javascript Prototype Visualized
Javascript Prototype VisualizedJavascript Prototype Visualized
Javascript Prototype Visualized
 
Modern JavaScript Applications: Design Patterns
Modern JavaScript Applications: Design PatternsModern JavaScript Applications: Design Patterns
Modern JavaScript Applications: Design Patterns
 

Mais de Guillermo Paz

ES6 in Production [JSConfUY2015]
ES6 in Production [JSConfUY2015]ES6 in Production [JSConfUY2015]
ES6 in Production [JSConfUY2015]Guillermo Paz
 
Decoupling your JavaScript
Decoupling your JavaScriptDecoupling your JavaScript
Decoupling your JavaScriptGuillermo Paz
 
Estándares Web con Chico UI
Estándares Web con Chico UIEstándares Web con Chico UI
Estándares Web con Chico UIGuillermo Paz
 
Chico UI - Retreat 2011
Chico UI - Retreat 2011Chico UI - Retreat 2011
Chico UI - Retreat 2011Guillermo Paz
 
Weat - Presentación
Weat - PresentaciónWeat - Presentación
Weat - PresentaciónGuillermo Paz
 

Mais de Guillermo Paz (7)

User First
User FirstUser First
User First
 
ES6 in Production [JSConfUY2015]
ES6 in Production [JSConfUY2015]ES6 in Production [JSConfUY2015]
ES6 in Production [JSConfUY2015]
 
Decoupling your JavaScript
Decoupling your JavaScriptDecoupling your JavaScript
Decoupling your JavaScript
 
HTML5: Introduction
HTML5: IntroductionHTML5: Introduction
HTML5: Introduction
 
Estándares Web con Chico UI
Estándares Web con Chico UIEstándares Web con Chico UI
Estándares Web con Chico UI
 
Chico UI - Retreat 2011
Chico UI - Retreat 2011Chico UI - Retreat 2011
Chico UI - Retreat 2011
 
Weat - Presentación
Weat - PresentaciónWeat - Presentación
Weat - Presentación
 

Último

ENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choomENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choomnelietumpap1
 
How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17Celine George
 
Full Stack Web Development Course for Beginners
Full Stack Web Development Course  for BeginnersFull Stack Web Development Course  for Beginners
Full Stack Web Development Course for BeginnersSabitha Banu
 
DATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersDATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersSabitha Banu
 
Gas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxGas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxDr.Ibrahim Hassaan
 
GRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTS
GRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTSGRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTS
GRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTSJoshuaGantuangco2
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatYousafMalik24
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Celine George
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)lakshayb543
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parentsnavabharathschool99
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPCeline George
 
Roles & Responsibilities in Pharmacovigilance
Roles & Responsibilities in PharmacovigilanceRoles & Responsibilities in Pharmacovigilance
Roles & Responsibilities in PharmacovigilanceSamikshaHamane
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfMr Bounab Samir
 
Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Celine George
 
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxGrade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxChelloAnnAsuncion2
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxiammrhaywood
 

Último (20)

ENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choomENGLISH6-Q4-W3.pptxqurter our high choom
ENGLISH6-Q4-W3.pptxqurter our high choom
 
How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17How to Add Barcode on PDF Report in Odoo 17
How to Add Barcode on PDF Report in Odoo 17
 
OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...
 
Full Stack Web Development Course for Beginners
Full Stack Web Development Course  for BeginnersFull Stack Web Development Course  for Beginners
Full Stack Web Development Course for Beginners
 
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptxYOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
 
DATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersDATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginners
 
Gas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxGas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptx
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
YOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptx
YOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptxYOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptx
YOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptx
 
GRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTS
GRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTSGRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTS
GRADE 4 - SUMMATIVE TEST QUARTER 4 ALL SUBJECTS
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice great
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parents
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERP
 
Roles & Responsibilities in Pharmacovigilance
Roles & Responsibilities in PharmacovigilanceRoles & Responsibilities in Pharmacovigilance
Roles & Responsibilities in Pharmacovigilance
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
 
Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17
 
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxGrade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
 

JavaScript: The prototype Property