Object Oriented Programming Sunil Pai, Y! Objects Objects and - - PowerPoint PPT Presentation

object oriented programming sunil pai y objects objects
SMART_READER_LITE
LIVE PREVIEW

Object Oriented Programming Sunil Pai, Y! Objects Objects and - - PowerPoint PPT Presentation

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


slide-1
SLIDE 1

Object Oriented Programming Sunil Pai, Y!

slide-2
SLIDE 2

Objects

slide-3
SLIDE 3

Objects and Javascript

slide-4
SLIDE 4

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

slide-5
SLIDE 5

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

3.141 0xff3322 1.4e20

slide-6
SLIDE 6

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

“the lazy dog” “1” + 1 “123”

slide-7
SLIDE 7

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

true false

slide-8
SLIDE 8

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

/[A-Za-z0-9]/gm

slide-9
SLIDE 9

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

function(p1, p2){ // do something // with p1, p2 return p1 + p2 }

slide-10
SLIDE 10

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

[ 1, ‘abc’, 2.4 ]

slide-11
SLIDE 11

Objects and Javascript

Numbers Strings Booleans Regexps Functions Arrays Objects

{ x: 200, y: 164, theta: 20 }

slide-12
SLIDE 12

Objects and Javascript

null undefined

slide-13
SLIDE 13

Javascript has superpowers

slide-14
SLIDE 14

Javascript has superpowers

functions are objects closures .prototype

slide-15
SLIDE 15

Javascript has superpowers

functions are objects closures .prototype

slide-16
SLIDE 16

Javascript has superpowers

functions are objects closures .prototype

slide-17
SLIDE 17

Javascript has superpowers

functions are objects closures .prototype

slide-18
SLIDE 18

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

slide-19
SLIDE 19

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

function Shirt(owner){ this.owner = owner } Shirt.prototype.iron=function(){ this.ironed = true } var myShirt = new Shirt(‘pi’) // myShirt.owner === ‘pi’ myShirt.iron() // myShirt.ironed === true

slide-20
SLIDE 20

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

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

slide-21
SLIDE 21

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

var Kurta = extends(Shirt) Kurta.prototype.wash = function(){ Shirt.prototype }

slide-22
SLIDE 22

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

var __hasProp = {}.hasOwnProperty var extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) { child[key] = parent[key] } } function Ctor() { this.constructor = child } Ctor.prototype = parent.prototype child.prototype = new Ctor() child.superclass = parent.prototype return child }

var Kurta = extends(Shirt) Kurta.prototype.wash = function(){ Shirt.prototype }

slide-23
SLIDE 23

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

var ctr = (function(){ var i = 0 return function(){ return i++ } })() ctr() // 0 ctr() // 1 ctr() // 2 // and so on

slide-24
SLIDE 24

OOP: First Principles

Constructors Abstraction Inheritance Encapsulation Polymorphism

// make do with runtime object // manipulation, “arguments” myShirt.iron = function(x, y){ x === arguments[0] // true y === arguments[1] // true var z = arguments[3] // doop de doo }

slide-25
SLIDE 25

( Demo )

slide-26
SLIDE 26

sidenote: MVC

slide-27
SLIDE 27

sidenote: modules

slide-28
SLIDE 28

sidenote: frameworks

slide-29
SLIDE 29

sidenote: other common patterns

slide-30
SLIDE 30

Questions?

slide-31
SLIDE 31

Party on, dudes.

@threepointone