JavaScript Tutorials - Herong's Tutorial Examples - 2.33, by Herong Yang
Defining Object Constructor Functions
This section provides a quick description on defining object constructor functions. A tutorial example is provided on creating a 'Book' constructor with 3 properties and 1 method.
The first thing to learn about prototype-based programming style in JavaScript is the constructor function. When writing a constructor function, we need to remember:
Here is a tutorial example that defines a constructor function called "Book(...)", which defines 3 properties and 1 method:
<html> <!-- Prototype_Constructor_Function.html Copyright (c) 2008 HerongYang.com. All Rights Reserved. --> <head> <title>Defining Object Constructor Functions</title> </head> <body> <pre> <script type="text/javascript"> // Defining the constructor function for a new object type function Book(title, author) { document.writeln("\nConstructing a \"Book\" object..."); this.title = title; this.author = author; this.price = undefined; this.getDesc = getDescription; } // Defining a function to be used as a method function getDescription() { return "\""+this.title+"\" by "+this.author; } // Creating an object of "Book" var myBook = new Book("JavaScript Tutorials", "Herong Yang"); document.writeln("\nChecking the \"Book\" object"); document.writeln(" Type: "+(typeof myBook)); document.writeln(" Instance of \"Book\": " +(myBook instanceof Book)); // Testing properties and methods document.writeln(" myBook.title: "+myBook.title); document.writeln(" myBook.author: "+myBook.author); document.writeln(" myBook.price: "+myBook.price); document.writeln(" myBook.getDesc(): "+myBook.getDesc()); // Trying to call a constructor function as a normal function Book("JavaScript Cookbook", "Yosef Cohen"); </script> </pre> </body> </html>
The output of the tutorial example is printed below:
Constructing a "Book" object... Checking the "Book" object Type: object Instance of "Book": true myBook.title: JavaScript Tutorials myBook.author: Herong Yang myBook.price: undefined myBook.getDesc(): "JavaScript Tutorials" by Herong Yang Constructing a "Book" object...
Notice that the last test statement proves that a constructor function is just a normal function, and you can call it directly. But calling a constructor function directly will not produce any result.
As a quick summary:
Table of Contents
ECMAScript Language Specification and JavaScript Dialects
Data Types, Variables and Expressions
Creating, Accessing, and Manipulating Arrays
Defining and Calling Functions
Web Browser Supporting JavaScript
Server-Side and Client-Side Web Scripting
►Defining Your Own Object Types
Prototype-Dased Object-Oriented Programming Style
Prototype-Based Programming Features in JavaScript
►Defining Object Constructor Functions
Adding Properties and Methods to Objects
"for ... in" and "for each ... in" Statements
"prototype" Property of the Constructor Function Object
"instanceof" Operator - Determining Object Type
"typeof" Operator and Data Types
Inheritance of Properties and Methods through the Prototype Object Chain
'jrunscript' - JavaScript Shell Command from JDK
Using Functions as "Function" Objects
Introduction to Built-in Object Types
W3C's Document Object Model (DOM) Specifications