JavaScript Objects & Properties

Ratings:
(4)
Views:873
Banner-Img
  • Share this blog:

 

JavaScript Objects Overview

JavaScript is an Object-Oriented Programming(OOP) language. A programming language can be called object-oriented if it provides four basic capabilities to developers:

Encapsulation, the capability to store related information, whether data or methods, together in an object

Aggregation, the capability to store one object inside another object.

The capability of a class to rely upon another class(or number of classes) for some of its properties and methods

The capability to write one function or method that works in a variety of different ways.

Objects are composed of attributes. If an attribute contains a function, it is considered to be a method of the object otherwise, the attribute is considered a property.

Learn JavaScript by Tekslate - Fastest growing sector in the industry. Explore Online "JavaScript Training" and course is aligned with industry needs & developed by industry veterans. Tekslate will turn you into JavaScript Expert.

 

JavaScript Object Properties

JavaScript Object  Properties can be any of the three primitive data types or any of the abstract data types, such as another object. JavaScript Object properties are usually variables that are used internally in the object's methods but can also be globally visible variables that are used internally in the object's methods but can also be globally visible variables that are used throughout the page.

The syntax for adding a property to an object is

ObjectName.objectProperty=propertyValue;

Example

Following is a simple example to show how to get a document title using the “title” property of the document object:

Var str=document.title;

JavaScript Object Methods

The methods are functions that let the object to do something be done to it. There is little difference between a function and a method, except that a function is a standalone unit of statements, and a method is attached to an object and can be referenced by this keyword.

Methods are useful for everything from displaying the contents of the object to the screen to performing complex mathematical operations on a group of local properties and parameters.

Example

Following is an example to show how to use the write() method of the document object to write any content on the document:

Document. write{“This is a test”};

User-Defined Objects

All user-defined objects and built-in objects are descendants of an object called Object.

The new Operator

The new operator is used to create an instance of an object. To create an object, the new operator is followed by the constructor method.

In the following example,the constructor methods are Object{},Array{} and Date{}.These construcots are built-in JavaScript functions.

Var employees=new Object{};

Var books=new Array{“C++”,”Perl”,”Java”};

Var day=new Date{August 15,1947”};

The Object() Constructor 

A constructor is a function that creates and initializes an object.Java Script provides a special constructor function called object() to build the object. The return value of the Object() constructor is assigned to a variable.

The variable contains a reference to the new object. The properties assigned to the object are not variables and are not defined with the var keyword.

 

Check Out JavaScript Tutorial

Example 1

This example demonstrates how to create an object: <html>

<head>

<title>User-define objects</title>

<script type=”text/javascript”>

Var book=new Object{};  //Create the object

Book.subject=;Perl”;//Assign properties to the object

Book.author  =”Mohtashim”;

</script>

</head>

<body>

<script type=”text/javascript’>

Document.write{“Book name is: “+book.subject+”,br>”};

Document.write{Book author is:”book.author +”<br>”}’

</script>

</body>

</html> 

Example 2

This example demonstrates how to create an object with a User-Defined Function. Here this keyword is used to refer to the object that has been passed to a function:

<html>

<head>

<title>User-define objects</title>

<script type=”text/javascript”>

Var myBook=new book{“Perl”, “Mchtashim”};

Document.write{‘Book title is :”+myBook.title+”<br>”};

Document.write{‘Book author is :”+myBook.author+”<br>”};

</script>

<body>

</html>

Defining Methods for an Object in JavaScript

The previous example demonstrates how the constructor creates the object and assigns properties. But we need to complete the definition of an object by assigning methods to it. 

<html>

<head>

<title>User-define objects</title>

<script type=”text/javascript”>

// Define a function which will work as a method

Function add Price{amount}

This.price=amount;

Function book{title,author}{

This.title=title;

This.auhtor=author;

This.addPrice=addPrice;//Assign that method as property.

</script>

</head>

<body>

<script type=”text/javascrpit”>

var myBook= new book(“Perl”,”Mohtashim”);

myBook.addprice(100);

document.write(“Book title is : “ + myBook.title + “<br>);

document.write(“Book author is : “ + myBook.author + “<br>);

document.write(“Book price is : “ + myBook.price + “<br>);

</script>

</body>

</html>

The with Keyword

The keyword is used as a kind of shorthand d for referring the properties or methods of an object.

The object specified as an argument to becomes the default object for the duration of the block that follows. The properties and methods for the object can be used without naming the object.

Syntax

with (object){

properties used without the object name and dot.

}

Example

<html>

<head>

<title>User-defined objects </title>

<script type=”text/javascript”>

//Define a function which will work as a method

function add price(amount)

with(this){

price=amount;

}

}

function book(title, author){

this.title=title;

this.author=author;

this.price=0;

this.addprice=addprice; //Assign that method as property.

}

</script>

</head>

<body>

<script type=”text/javascrpit”>

var myBook= new book(“Perl”,”Mohtashim”);

myBook.addprice(100);

document.write(“Book title is : “ + myBook.title + “<br>);

document.write(“Book author is : “ + myBook.author + “<br>);

document.write(“Book price is : “ + myBook.price + “<br>);

</script>

</body>

</html>

JavaScript Native Objects

JavaScript has several built-in or native objects. These objects are accessible anywhere in your program and will work the same way in any browser running in any operating system.

Here is the list of all important JavaScript Native Objects

JavaScript Number object

JavaScript Boolean object

JavaScript String object

JavaScript Array object

JavaScript Date object

JavaScript Math object

JavaScript RegExp object

JavaScript –The string Object

The String object lets you work with a series of characters and wraps Javascript's string primitive data type with a number of helper methods.

Because Javascript automatically converts between string primitives and String objects, you can call any of the helper methods of the String object on a string primitive.

Syntax

Creating a String object

var val =new string(string)

The string parameter is a series of characters that have been properly encoded.

String Properties

Here is a list of each property and its description.

 Property Description
Constructor Returns a reference to the String function that created the object.
length Returns the length of the string
prototype The prototype property allows you to add properties and methods to an object.

String Methods

Here is a list of each method and its description.

 Method Description
charAt() Returns the character at the specified index.
charCodeAt() Returns a number indicating the Unicode value of the character at the given index.
concat() Combines the text of two strings and returns a new string.
indexOf() Returns the index within the calling String object of the first occurrence of the specified value, or -1 if not found.
lastIndexOf() Returns the index within the calling String object of the last occurrence of the specified value, or -1 if not found.
localeCompare() Returns a number indicating whether a reference string comes before or after or is the same as the given string in sort order.
match() Used to match a regular expression against a string.
replace() Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.
search() Execute the search for a match between a regular expression and a specified string.
slice() Extract a section of a string and returns a new string.
spilt() Splits a string object into an array of the string by separating the string into substrings.

You liked the article?

Like : 0

Vote for difficulty

Current difficulty (Avg): Medium

Recommended Courses

1/15

About Author
Authorlogo
Name
TekSlate
Author Bio

TekSlate is the best online training provider in delivering world-class IT skills to individuals and corporates from all parts of the globe. We are proven experts in accumulating every need of an IT skills upgrade aspirant and have delivered excellent services. We aim to bring you all the essentials to learn and master new technologies in the market with our articles, blogs, and videos. Build your career success with us, enhancing most in-demand skills in the market.