Objects

A container of related information. Objects have properties those can be numbers, strings, arrays, functions, and even other objects.

Creating an object with javascript

Object Literal
 

var myBox = {}; // Curly brackets says to make a new object

var myBox = { height : 12, width: 23, length: 10, volume: 480,
                       material: "cardboard",
                       contents: ["Item 1","Item 2", "Item 3"]
                     };

Accesing object's properties

Sample with the dot operator

Following the sample above, in order to access the width property of the object myBox, we must do the next

​myBox.width;      // we get "23"
myBox.materials;  // we get "cardboard"
myBox.contents;   // we get ["Item 1","Item 2", "Item 3"]

Sample with the array way

myBox["width"]; // we get "23"
myBox["material"];// we get "cardboard"

Changing property values of an object

Sample

myBox.width = 12;
myBox.contents.push("Some other book");

Adding properties even after the object creation

Sample with the dot operator

The next properties have not been added at the objects creation process

myBox.weight = 24;
myBox.destination = "Miami";

Sample with the array way

The next property was not created at the object's birth, note that the property has spaces.

myBox["# of stops"] = 2;

Accessing properties of an object through expressions

Suppose we have these properties at the myBox object

• destination1
• destination2

for (var i = 1; i <=  2; i++){
   console.log( myBox["destination"+i]);
}

Deleting properties

Syntax

delete myBox.contents;

Note : delete will always return true.

An interesting function 

This function will set an object using expressions and array like access to the object's properties

function addBook (box, name, writer){
      box["# of Books"]++;
      box["book" + box["# of Books"]] = {title:name, author: writer};
}

Accessing nested objects properties

Sample

console.log(myBox.book1.title);

Objects functionality
 

Properties can also be functions for example (we can see two function declarations as a sample to see the difference among an internal function and a external one)

​var aquarium = {
    Nemo : { type: "fish", species: "clownfish", length: 3.7 },
    Marlin: { type: "fish", species: "clownfish", length: 4.1 },
    addCritter : function (name, type, species, length){
      this[name] = {type: type, species: species, length: length};
    }
}

// External function, that has a container reference variable
function addCritter(container, name, type, species, length){
   container[name] = {type: type, species: species, length: length};
}

// Call to the object's addCritter function
aquarium.addCritter("Bubbles", "fish", "yellow tang", 5.6);

// Create an anonymus function 
aquarium.takeOut = function ( name ) {
  this[name].name = name; // This will create a property name for the object to be removed
  var temp = this[name];
  delete this[name];
  return temp;
};

// Using the anonymous function
var fishOutOfWater = aquarium.takeOut("Marlin");

Enumeration with the FOR-IN loop

The for-in loop allows us to access each enumerable property in turn

Sample

// key is just a name from which we will access the property later on
​for( key in aquarium ){
  console.log(key);
}

// Output, check that all of these are properties of the aquarium object

// Nemo
// Bubbles
// addCritter
// takeOut

var numFish = 0;
for (key in aquarium){
   if (aquarium[key].type == "fish"){
       numFish++;
   }
}

// aquarium["addCritter"].type;    Well since aquarium is a function, the result will be undefined

// Creating a anonymous function
aquarium.countFish = function(){
  for (key in this){
    if (this[key].type == "fish"){
      numFish++;
    }
  }
};

var poorDory = aquarium.takeOut("Dory");

aquarium.countFish();

Accesing Object´s property propertis
 

Check out this example

var rockSpearguns = {
  Sharpshooter: {barbs: 2, weight: 10, heft: "overhand"},
  Pokepistol: {barbs: 4, weight: 8, heft: "shoulder"},
  Javelinjet: {barbs: 4, weight: 12, heft: "waist"},
  Firefork: {barbs: 6, weight: 8, heft: "overhand"},
  "The Impaler": {barbs: 1, weight: 30, heft: "chest"}
};

function listGuns(guns) {
  for (var speargun in guns) {
    // modify the log message here
    console.log("Behold! " + speargun + ", with " + guns[speargun].heft + " heft!");
  }
}

listGuns(rockSpearguns);

// Output
Behold! Sharpshooter, with overhand heft!
Behold! Pokepistol, with shoulder heft!
Behold! Javelinjet, with waist heft!
Behold! Firefork, with overhand heft!
Behold! The Impaler, with chest heft!