CoffeeScript - Objects

Objects in CoffeeScript are similar to those in JavaScript. These are a collection of the properties, where a property includes a key and a value separated by a semi colon (;). In short, CoffeeScript objects are a collection of key-value pairs. The objects are defined using curly braces, an empty object is represented as {}.

Syntax

Given below is the syntax of an object in CoffeeScript. In here, we place the key-value pairs of the objects within the curly braces and they are separated using comma (,).

object ={key1: value, key2: value,......keyN: value}

Example

Following is an example of defining an object in CoffeeScript. Save this code in a file with name objects_example.coffee

student = {name: "Mohammed", age: 24, phone: 9848022338 }
 

Open the command prompt and compile the .coffee file as shown below.

> coffee -c objects_example.coffee

On compipng, it gives you the following JavaScript.

// Generated by CoffeeScript 1.10.0
(function() {
  var student;

  student = {
    name: "Mohammed",
    age: 24,
    phone: 9848022338
  };

}).call(this);

Just as in arrays, we can remove the commas by specifying the key-value pairs in new pnes as shown below.

student = {
  name: "Mohammed" 
  age: 24
  phone: 9848022338 
  }

Indentations instead of curly braces

Just pke other block statements in CoffeeScript, we can use indentations instead of curly braces {} as shown in the following example.

Example

We can rewrite the above example without curly braces as shown below.

student = 
  name: "Mohammed" 
  age: 24
  phone: 9848022338 

Nested objects

In CoffeeScript, we can write objects within objects.

Example

The following example demonstrates the nested objects in CoffeeScript. Save this code in a file with name nested_objects.coffee

contact =
  personal:
    email: "personal@gmail.com"
    phone:  9848022338
  professional:
    email: "professional@gmail.com"
    phone:  9848033228

Open the command prompt and compile the .coffee file as shown below.

> coffee -c nested_objects.coffee

On compipng, it gives you the following JavaScript.

// Generated by CoffeeScript 1.10.0
(function() {
  var contact;

  contact = {
    personal: {
      email: "personal@gmail.com",
      phone: 9848022338
    },
    professional: {
      email: "professional@gmail.com",
      phone: 9848033228
    }
  };

}).call(this);

Comprehensions over objects

To iterate over the contents of an object, we can use comprehensions. Iterating the contents of an object is same as iterating the contents of an array. In objects, since we have to retrive two elements keys and values we will use two variables.

Example

The following is an example showing how to iterate the contents of an object using comprehensions. Save this code in a file with name object_comprehensions.coffee

student = 
  name: "Mohammed" 
  age: 24
  phone: 9848022338 

console.log key+"::"+value for key,value of student

Open the command prompt and compile the .coffee file as shown below.

> coffee -c object_comprehensions.coffee

On compipng, it gives you the following JavaScript.

// Generated by CoffeeScript 1.10.0
(function() {
  var key, student, value;

  student = {
    name: "Mohammed",
    age: 24,
    phone: 9848022338
  };

  for (key in student) {
    value = student[key];
    console.log(key(+"::" + value));
  }

}).call(this);

Now, open the command prompt again and run the CoffeeScript file as shown below.

> coffee object_comprehensions.coffee

On executing, the CoffeeScript file produces the following output.

name::Mohammed
age::24
phone::9848022338 

Arrays of Objects

In CoffeeScript, an array can also contain objects in as shown below.

  a = [
     object1_key1: value
     object1_key2: value
     object1_key3: value
  ,
     object2_key1: value
     object2_key2: value
     object2_key3: value
]

The following example shows how to define an array of objects. We can just pst the key value pairs of the objects we want in an array by separating them using commas (,).

students =[  
    name: "Mohammed" 
    age: 24
    phone: 9848022338 
  ,  
    name: "Ram" 
    age: 25
    phone: 9800000000 
  ,  
    name: "Ram" 
    age: 25
    phone: 9800000000   
 ]  
console.log student for student in students

Open the command prompt and compile the .coffee file as shown below.

c:> coffee -c array_of_objects.coffee

On compipng, it gives you the following JavaScript.

// Generated by CoffeeScript 1.10.0
(function() {
  var i, len, student, students;

  students = [
    {
      name: "Mohammed",
      age: 24,
      phone: 9848022338
    }, {
      name: "Ram",
      age: 25,
      phone: 9800000000
    }, {
      name: "Ram",
      age: 25,
      phone: 9800000000
    }
  ];

  for (i = 0, len = students.length; i < len; i++) {
    student = students[i];
    console.log(student);
  }

}).call(this);

Now, open the command prompt again and run the CoffeeScript file as shown below.

c:> coffee array_of_objects.coffee

On executing, the CoffeeScript file produces the following output.

{ name:  Mohammed , age: 24, phone: 9848022338 }
{ name:  Ram , age: 25, phone: 9800000000 }
{ name:  Ram , age: 25, phone: 9800000000 }

Reserved Keywords

JavaScript does not allow reserved keywords as property names of an object, if we want use them, we have to wrap them using double quotes " ".

Example

Consider the following example. Here we have created a property with name class, which is a reserved keyword. Save this code in a file with name reserved_keywords.coffee

student ={ 
  name: "Mohammed" 
  age: 24
  phone: 9848022338
  class: "X"
  }
console.log key+"::"+value for key,value of student

Open the command prompt and compile the .coffee file as shown below.

c:> coffee -c reserved_keywords.coffee

On compipng, it gives you the following JavaScript. Here you can observe that the CoffeeScript compiler wrapped the keyword class with double quotes on behalf of us.

// Generated by CoffeeScript 1.10.0
(function() {
  var key, student, value;

  student = {
    name: "Mohammed",
    age: 24,
    phone: 9848022338,
    "class": "X"
  };

  for (key in student) {
    value = student[key];
    console.log(key + "::" + value);
  }

}).call(this);

Now, open the command prompt again and run the CoffeeScript file as shown below.

c:> coffee array_of_objects.coffee

On executing, the CoffeeScript file produces the following output.

name::Mohammed
age::24
phone::9848022338
class::X