ch6 - Object

Objects are created with the new operator. This operator must be followed by the name of a constructor that serves to initialize the object. For example, we can create an empty object (an object with no properties) like this:

var o = new Object();

JavaScript supports other built-in constructor functions that initialize newly created objects in other, less trivial, way. For example, the Date() constructor initializes an object that represents a date and time:

//The current date and time
var now = new Date();  
// Represents December 31, 2000                     
var new_years_eve = new Date(2000, 11, 31);

Later in this chapter, we'll see that it is possible to define custom constructor methods to initialize newly created objects in any way you desire.

Object literals provide another way to create and initialize new object. An object literal allows us to embed an object description literally in JavaScript code in much the same way that we embed textual data into JavaScript code as quoted strings. An object literal consists of a comma-separated list of property specifications enclosed within curly braces. Each property specification in an object literal consists of the property name followed by a colon and the property value. For example:

var circle = {x:0,y:0,radius:2};
var homer={
           name: "Homer Simpson",
           age: 34,
           married: true,
           occupation: "Plant operator",
           email: "homer@simpsons.com"
};

The object literal syntax is defined by the ECMAScript v3 specification and implemented in JavaScript 1.2 and later.

6.1.2 Setting and Querying Properties

You normally use the . operator to access the value of an object's properties. The value on the left of the . should be a reference to an object (usually just the name of the variable that contains the object reference). The value on the right of this . should be the name of the property. For example, you would refer to the property p in object o with o.p or to the property radius in the object circle with circle.radius. Object properties work like variables: you can store values n them and read values from them. For example:

// Create an object. Store a reference to it in a variable.
var book = new Object();

// Set a property in the object

book.title = "JavaScript: The definitive Guide";

// Set some more properties. Note the nested objects.
book.chapter1 = new Object();
book.chapter1.title = "Introduction to JavaScript";
book.chapter1.pages = 10;
book.chapter2 = {title:"Lexical Structure", page:6};

//Read some property
alert("Outline: "+book.title +"\n\t"+
      "Chapter 1 " + book.chapter1.title +"\n\t"+
      "Chapter 2 " + book.chapter2.title);

6.1.3 Enumerating Properties

the for/in loop provides a way to loop through, or enumerate, the properties of an object. For example:

function DisplayPropertyNames(obj){
  var names = "";
  for(var name in obj){
    names += name +"\n";
  }
  alert(names);
}

Note that the for/in loop does not enumberate properties in any specific order, and although it enumerates all user-defined properties, it does not enumerate certain predefined properties or methods.

6.1.4 Undefined Properties

If you attempt to read the value of a property that does not exist, you end up retrieving the undefined value.

You can use the delete operator to delete a property of an object:

delete book.chapter2;

Note that deleting a property does not merely set the property to undefined; it actually removes the property from the object. The for/in loop demonstrates this difference: it enumerates properties that have set to the undefined value, but it does not enumerate deleted properties.

References

(1) Aland Shalloway & James R. Trott, Design Patterns Explained, Second Edition.

(2) Allen Holub, Holub on Patterns, Learning Design Patterns by Looking at Code

(3) Eric Evans, Domain-Driven Design, Tackling complexity in the heart of software.

Part I - JS language

Part II- JS objects

Part III - Client-Side JS

JS Articles & FAQ

References

Advertisement