Javascript Custom Object

An object in Javascript is an "unordered collection of properties each of which contains a primitive value, object, or function."

An object is an array of values in no particular order.

Each property or method is identified by a name and mapped to a value.

Javascript objects are like hash tables: a grouping of name-value pairs where the value may be data or a function.

Object Creation

The simplest way to create a custom object is to create a new instance of Object and add properties and methods to it.


var person = new Object();
person.name = "XML";
person.sayName = function(){//from  w  ww . j  av  a2  s .c o  m
   console.log(this.name);
};

var tutorial = new Object(); 
tutorial.name = "JavaScript"; 
tutorial.pageSize = 9; 
        
console.log(tutorial.name); //JavaScript
console.log(tutorial.pageSize); //9

The code above generates the following result.

Object Literal

The previous example can be rewritten using object literal notation as follows:


var person = {
    name: "XML",/*from www.j  a v a 2  s.  c  o  m*/
    sayName: function(){
        console.log(this.name);
    }
};
console.log(person.name);
person.sayName();

var tutorial = {
   name : "JavaScript",
   pageSize : 9 
}; 
       
console.log(tutorial.name); //JavaScript
console.log(tutorial.pageSize); //9

The code above generates the following result.

Object Compare

The following code is performing Equality and Identity Tests on Objects.


var myData1 = {
  name : "JavaScript",
  weather : "Good",
};// w  w w .ja va2  s  .  c  o  m
var myData2 = {
  name : "JavaScript",
  weather : "Good",
};

var myData3 = myData2;

var test1 = myData1 == myData2;
var test2 = myData2 == myData3;
var test3 = myData1 === myData2;
var test4 = myData2 === myData3;
console.log("Test 1: " + test1 + " Test 2: " + test2);
console.log("Test 3: " + test3 + " Test 4: " + test4);

The code above generates the following result.

object method

object methods are functions which define the action on your object.

The following code defines a method to display object's properties.


var myData = {
  name : "JavaScript",
  weather : "Good",
  printMessages : function() {
    console.log("Hello " + this.name + ". ");
    console.log("Today is " + this.weather + ".");
  }
};
myData.printMessages();

The code above generates the following result.

Example

We can add new methods to an object by setting the value of a property to be a function.


var myData = {
  name : "JavaScript",
  weather : "Good",
};
myData.sayHello = function() {
  console.log(this.name);
};
    
myData.sayHello();

The code above generates the following result.

Javascript Object Properties

Object properties are data value grouped into object.

The following code shows how to access properties via bracket notation.


var tutorial = {
   name : "JavaScript",
   pageSize : 9 
}; 
console.log(tutorial["name"]); //"JavaScript" 
console.log(tutorial.name); //"JavaScript"

The code above generates the following result.

Example 2

The following code uses variables for property access.


var tutorial = {
   name : "JavaScript",
   pageSize : 9 
}; 

var propertyName = "name"; 
console.log(tutorial[propertyName]); //"JavaScript"

The code above generates the following result.

Example 3

The following code uses bracket notation when the property name contains space:


var tutorial = {
    "tutorial name" : "JavaScript",
    pageSize : 9 
}; 
console.log(tutorial["tutorial name"]);

The code above generates the following result.

Example 4

The for...in loop performs the statement for each property.


var myData = {
  name : "JavaScript",
  weather : "Good",
  printMessages : function() {//from w w  w .ja  v  a2 s.  co  m
    console.log("Hello " + this.name + ". ");
    console.log(this.name +" is " + this.weather + ".");
  }
};

myData.printMessages();

for ( var prop in myData) {
  console.log("Name: " + prop + " Value: " + myData[prop]);
}

The code above generates the following result.

Example 5

A comma separates properties in an object literal. There is no need to add comma for the last property.

Property names can also be specified as strings or numbers:


var tutorial= {
   "name" : "JavaScript", 
   "pageSize" : 9,
   1: true 
}; 
console.log(tutorial.name); //JavaScript
console.log(tutorial.pageSize); //9
console.log(tutorial["1"]); //

The code above generates the following result.

Example 6

Object literals can also be used to pass a large number of optional arguments to a function:


function displayInfo(args) { /*  w  w w. j  a v a 2  s . c  o  m*/
    if (typeof args.name == "string"){ 
        console.log("Name: " + args.name); 
    } 
    if (typeof args.pageSize == "number") { 
        console.log("PageSize: " + args.age); 
    } 
} 
displayInfo({ 
      name: "JavaScript", 
      pageSize: 9 
}); 

displayInfo({ 
     name: "HTML" 
});

The code above generates the following result.