oops in javascript

24
OOPS in Javascri pt part 1

Upload: vijaya-anand

Post on 05-Dec-2014

5.971 views

Category:

Technology


5 download

DESCRIPTION

This presentation shows how to create simple objects in JavaScript.

TRANSCRIPT

Page 1: OOPS in javascript

OOPS in Javascript

part 1

Page 2: OOPS in javascript

object?

Page 3: OOPS in javascript

object?

instance of a type

Page 4: OOPS in javascript
Page 5: OOPS in javascript

instance of type dart frog

Page 6: OOPS in javascript
Page 7: OOPS in javascript

instances of type walrus

Page 8: OOPS in javascript

object?

• instance of a type• type represents anything a dart frog or a

walrus

Page 9: OOPS in javascript

how to create objects?

Page 10: OOPS in javascript

how to create objects?let’s start with creating a type… say ‘dartfrog’

Page 11: OOPS in javascript

how to create objects?let’s start with creating a type… say ‘dartfrog’

var dartfrog = function(){}

Page 12: OOPS in javascript

how to create objects?let’s start with creating a type… say ‘dartfrog’

var dartfrog = function(){}

type

Page 13: OOPS in javascript

adding properties and behaviors

Page 14: OOPS in javascript

propertiesvar dartfrog = function(){ this.name = ‘’; this.color = ‘’; this.poisonous = true;}

Page 15: OOPS in javascript

propertiesvar dartfrog = function(){ this.name = ‘’; this.color = ‘’; this.poisonous = true;}

properties

Page 16: OOPS in javascript

propertieslet’s fill the properties at the time of creation by passing values.

var dartfrog = function(name, color, poisonous){ this.name = name; this.color = color; this.poisonous = poisonous;}

Page 17: OOPS in javascript

behaviorsvar dartfrog = function(name, color, poisonous){ this.name = name; this.color = color; this.poisonous = poisonous; this.jump = function(){ alert(“JUMP JUMP JUMP”); } ; this.sing = function(){ alert(“CROAK CROAK CROAK”); } }

Page 18: OOPS in javascript

behaviorsvar dartfrog = function(name, color, poisonous){ this.name = name; this.color = color; this.poisonous = poisonous; this.jump = function(){ alert(“JUMP JUMP JUMP”); } ; this.sing = function(){ alert(“CROAK CROAK CROAK”); } }

Methods or behaviors

Page 19: OOPS in javascript

let’s create some frogs and make them sing

Page 20: OOPS in javascript

creating objectsvar jackstraw = new dartfrog(“jackstraw”, “strawberry”, true);

Page 21: OOPS in javascript

creating objectsvar jackstraw = new dartfrog(“jackstraw”, “strawberry”, true);

name

color

poisonous?

Page 22: OOPS in javascript

creating objectsvar jackstraw = new dartfrog(“jackstraw”, “strawberry”, true);

var stickyellow = new dartfrog(“stickyellow “, “yellow”, true);

var blueman = new dartfrog(“blueman “, “blue”, true);

Page 23: OOPS in javascript

calling methodsGuys are you ready. come on sing!!

jackstraw.sing();stickyellow.sing();blueman.sing();

CROAK CROAK

CROAK

CROAK CROAK CROAK

CROAK CROAK CROAK

Page 24: OOPS in javascript

Thank You