OOPS in javascript

Preview:

DESCRIPTION

This presentation shows how to create simple objects in JavaScript.

Citation preview

OOPS in Javascript

part 1

object?

object?

instance of a type

instance of type dart frog

instances of type walrus

object?

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

walrus

how to create objects?

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

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

var dartfrog = function(){}

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

var dartfrog = function(){}

type

adding properties and behaviors

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

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

properties

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;}

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”); } }

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

let’s create some frogs and make them sing

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

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

name

color

poisonous?

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

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

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

calling methodsGuys are you ready. come on sing!!

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

CROAK CROAK

CROAK

CROAK CROAK CROAK

CROAK CROAK CROAK

Thank You