Presentation is loading. Please wait.

Presentation is loading. Please wait.

Custom JavaScript Objects JavaScript 7. Constructor Functions Custom JavaScript objects are based on functions called constructor functions Constructor.

Similar presentations


Presentation on theme: "Custom JavaScript Objects JavaScript 7. Constructor Functions Custom JavaScript objects are based on functions called constructor functions Constructor."— Presentation transcript:

1 Custom JavaScript Objects JavaScript 7

2 Constructor Functions Custom JavaScript objects are based on functions called constructor functions Constructor functions have two types of elements: properties and methods A property is a variable and is consider the data of the object A method is a function(built-in or created) that is called from within the object

3 Constructors The following is a constructor function with four properties function car(make, model, year, owner) { – this.make = make; – this.model = model; – this.year = year; – this.owner = owner; } Keyword “this” is used to assign values to the object's properties based on the values passed to the function

4 Creating Objects Objects are created from constructors functions using the “new” keyword The following creates a new object named nicecar from the car constructor function and passes some arguments, which are assigned to the properties nicecar = new car (“Chevy”, “Lumina”, “1993”, “Byron”); The nicecar object now has four properties: make, model, year, and owner

5 Accessing an Object Property To access a property, add a period and the property name to the object Example, to access the model property of the nicecar object you type nicecar.model To display or view it, it needs to be inside a document.writeln(); – document.writeln(nicecar.model)

6 java7 function car(make, model, year, owner) { this.make = make; this.model = model; this.year = year; this.owner = owner;} nicecar = new car ("Chevy", "Lumina", "1993", "Byron"); nextcar = new car ("Ford", "Thunderbird", "1990", "Sam"); document.writeln(nextcar.owner); …Sam document.writeln(“my car is a” + nicecar.model); …my car is a Lumina

7 Adding Properties to an Object A property can be added to any object after it is created To add a property to the object, start with the object followed by a period, then the new property followed by the value function car(make, model, year, owner) { this.make = make; this.model = model; this.year = year; this.owner = owner;} nicecar = new car ("Chevy", "Lumina", "1993", "Byron"); nextcar = new car ("Ford", "Thunderbird", "1990", "Sam"); nicecar.color = "dark blue";

8 Adding a Property to Every Object Creating a new property for an object does not create a new property to all the object To create a property for all the objects, a prototype property is used Type the function, then prototype, followed by the new property and the value – car.prototype.color = “dark blue”; This will cause every property to be the same

9 Custom Objects Methods Constructor functions have two types of elements: properties and methods Until now, constructor function only contained properties A method is also a function, built-in or created A method is called from within the object After a method is created, it must be added to the constructor function by using the following – this.method_name = function_name

10 function car(make, model, owner) { this.make = make; this.model = model; this.owner = owner; this.display = display;} nicecar = new car ("Chevy", "Lumina", "Byron"); nextcar = new car ("Ford", "Thunderbird", "Sam"); function display( ){ document.writeln(this.make); document.writeln(this.model); document.writeln(this.owner);} nicecar.display( ); nextcar.display( );


Download ppt "Custom JavaScript Objects JavaScript 7. Constructor Functions Custom JavaScript objects are based on functions called constructor functions Constructor."

Similar presentations


Ads by Google