JavaScript Object
JavaScript Object are represented as two different faces,
- First is Object used as essentially associative arrays, create for mapping between keys and value pairs.
- Second is Object is concept of object-oriented programming. In this lesson we'll learn both faces.
What is Object?
An object is an abstract data type which refers to a location in memory with the addition of nested object, inheritance, encapsulation, and polymorphism.
Nested object: Object is capable to store object where one object contains another object.
Inheritance: Object is capable to based on another object (parent/super object). You can access properties and methods from inherited object.
Encapsulation: Object is capable to store related data and methods into a single component.
Polymorphism: Object is capable to access/represents differently depending on their data types. It's having an ability to redefine methods for deriving objects.
JavaScript Object
Creating object
An empty object, we can also say the empty associative array is create following two different syntax's,
var myObj = new Object();
var myObj = { } // both are same
Assigning object
You can store data by keys and value pairs. We can use "dot" property notation for assigning, accessing, and deleting Object values.
var myObj = {}; // indicates an object is created
myObj.commercial = ".com";
myObj.network= ".net";
myObj.organization= ".org";
myObj.government= ".gov";
You can also assign values to multiple properties at the time of creating an object { key1: value1, key2: value2, ... }.
var myObj = {
"commercial": ".com",
"network": ".net",
"organization": ".org",
"government": ".gov"
};
Accessing object
You can use either square brackets or dot notation to access object properties.
var myObj = {}; // indicates an Object is created
myObj.commercial = ".com";
myObj.network= ".net";
myObj.organization= ".org";
myObj.government= ".gov";
document.writeln("commercial domain: " + myObj['commercial']); // Outputs .com
document.writeln("commercial domain: " + myObj.commercial); // Outputs .com
Deleting object
delete statement is preferable for removing properties,
delete myObj.commercial; // delete value by 'commercial' key
Creating Nested Objects
You can store objects, where one object contains another object.
var myObj = {
"commercial": ".com",
"network": ".net",
"country_domains": { // Nested Object - store country domains that are registered first.
"usa": ".us",
"uk": ".uk",
"israel": ".il",
"australia": ".au"
},
"organization": ".org",
"government": ".gov"
};
document.writeln("commercial domain: " + myObj.commercial); // Outputs .com
document.writeln("israel domain: " + myObj.country_domains.israel); // Outputs .il
for..in loop to Iterate an Object
JavaScript for.. in statement used to iterate over the key-value pairs.
var myObj = {
"commercial": ".com",
"network": ".net",
"organization": ".org",
"government": ".gov"
};
for(key in myObj){
document.writeln(key + " domain : " + myObj[key]);
}
for...in statement iteration all object properties, but doesn't give guarantee to iterate in the order of definition.
Google Chrome, Mozilla Firefox, IE, Safari, Opera iterates in the order of keys definition (numeric keys first sort, then after iterate and last iterate string keys).
JavaScript Object Properties and methods
Object can be stored not only variables but also store data structures (associative array, set, union), and functions.
var employee= {
name: "Opal Kole",
salary: function() {
this.salary= 15000;
this.allowance = 1300;
},
information: function() {
document.writeln("Employee name: " + employee.name);
document.writeln("Employee Salary: " + this.salary);
document.writeln("Employee Allowance: " + this.allowance );
}
}
employee.salary()
employee.information()
JavaScript new keyword to create user-define object
JavaScript new keyword creates an instance of a user-defined object type as well as built-in object types that has a constructor function of the object.
Syntax
new constructor[([arguments])]
Example
function Employee(name, salary) {
this.name = name
this.salary= 15000;
}
var employee = new Employee("Opal Kole", "15000")
document.writeln("Employee Name: " + employee.name);
document.writeln("Employee Salary: " + employee.salary);
View: Buit-in Object