Techcss
Javascript_page_menu

JavaScript Object

Generally we get two types of objects to use in JavaScript, which are built-in object and custom object.

Built-In Objects

The built-in objects actually holds the core of the JavaScript's logical environment of script. We do use the built-in objects by refering through their well built predefined properties, methods and events.

The Bulit-In Objects
Object Description
Anchor Represents a hypertext link for a text string in an HTML document
Button This is actually a push button appears on an HTML document to perform the events
Check Box It let us have control over multiple choice value in an HTML document
Date It handle time and date through date function
Document It consists the properties and methods of an HTML document file
Elements Array Represents a list of the individual form elements (such as check boxes, text objects, buttons etc.) which is accessible through an indexed array
Form It is a very important object for user interactivity associated with data inputs at browser(client) end and process the matter through its methods and properties
Frame It is an scollable window which can be embedded in HTML page to display its content.
Hidden It provides the control over objects to hide or unhide on a HTML form
History Display the list of accessed or navigated URL links which can be revisited by user as desired.
Link Represents a hyperlink through text or image using <a> tag.
Location Provides specific data on currently active URL
Math To perform the mathematical calculation of input data.
Navigator To provide information about the active browser information
Password It is a special object to secure a web page documents from unauthorised access. So it checks the user authentication.
Radio Provides access to a radio button which used to choose an option from multiple choice
Reset Control a reset button in in an HTML form
Select To access indexed array to the multiple value contained selection list in an HTML form
String To process strings in an HTML page
Submit Process submit button on an HTML form
Text To access a text input field on an HTML form
Textarea Process multiline scrollable text input area on an HTML form
Window Controller of 2nd highest level object, above the document object.

 


Custom Object

To create custom objects defining functions is a generous way for the JavaScript programmers. Before creating the object we need to define it by outlining its properties. A constructor function is used to define the name and properties of the object.

Using this function an object can be created.

mybook = new book("itm07", "JavaScript for web programmer", "Arindam Sarkar") 
// This is an instance of the object mybook.

* We can enter the following statements in the body of the script to display data,
		document.write(mybook.book_id);
		document.write(mybook.book_name);
		document.write(mybook.author); 

*We can also add new properties to an already existing object by assigning values to a new property. If we want to add a property defining the publisher of mybook

mybook.publisher = "Techcss Publishing House";
This will add the publisher property to mybook, but other instances of the book object will remain unaffected. In order to include this property to the object definition function before defining any instances of the object.

We can also define objects as properties of objects. Let us create an object containing the authors details.

	function author(name, address, phone)
	{
	 this.name = name;
	 this.address = address;
	 this.phone = phone;
	}
* Now the instance of the author object can be written as follows :
sp_details = new author ("Arindam Sarkar","35/6, K.Lane,Belgachia Metro","9804554992");
While creating instances of the object book we make use of the author object
mybook = new book("itm07","JavaScript for web programmer", sp_details);

The authors name can be found by the following format

document.write(mybook.author.name)

To add a method to an object we need to create a function which defines the method. We can create a method that displays the details of the object book bt using the following function :

function display() {

document.write ("<b>Book Id :</b>" + this.book_id + "<br />"); 
document.write ("<b>Book Name :</b>" + this.book_name + "<br />");
document.write ("<b>Author's Name :</b>" + this.author.name + "<br />");
document.write ("<b>Author's Address :</b>" + this.author.address + "<br />");
document.write ("<b>Author's Phone No. :</b>" + this.author.phone + "<br />");
}

Appending the following statement to the object definition we can add the method to the object book.

this.display=display;

The details of theobjects, book and author can be displayed by using the following command

mybook.display();

Here this refers to the current object