Javascript Object Oriented Design - Javascript Property type

• « Previous
• Next »

There are two different types of properties: data properties and accessor properties.

Data properties contain a value, like the name property from book1.

The default behavior of the [[Put]] method is to create a data property.

Accessor properties don't contain a value.

Accessor property it defines a function to call when the property is read, and a function to call when the property is written to.

Accessor properties only require either a getter or a setter.

There is a special syntax to define an accessor property using an object literal:

var book1 = { 
   _name : "Javascript", 
/*  w w w .  j  av a2s .c  om*/
   get name() { 
        console.log("Reading name"); 
        return this._name; 
    }, 
   set name(value) { 
        console.log("Setting name to %s", value); 
        this._name = value; 
    } 
}; 

console.log(book1.name); 

book1.name = "CSS"; 
console.log(book1.name); 

The code above generates the following result.

The special keywords get and set are used before the accessor property name.

Getters are expected to return a value.

Setters receive the value being assigned to the property as an argument.

We don't need to define both a getter and a setter and we can choose one or both.

If you define only a getter, then the property becomes read-only, and attempts to write to it will fail silently in nonstrict mode and throw an error in strict mode.

If you define only a setter, then the property becomes write-only, and attempts to read the value will fail silently in both strict and nonstrict modes.

Property attributes

Javascript can interact with property attributes directly.

We can add new attributes to support additional functionality.

We can create properties that behave the same way as built-in JavaScript prop erties.

Common Attributes

There are two property attributes shared between data and accessor properties.

One is [[Enumerable]], which determines whether it can be iterated.

Another is [[Configurable]], which determines whether the property can be changed.

We can remove a configurable property using delete and can change its attributes at any time.

By default, all properties we declare on an object are both enumerable and configurable.

We can use the method defineProperty to change the [[Enumerable]] and [[Configurable]].

To make an object property nonenumerable and nonconfigurable:

var book1 = { 
   name : "Javascript" 
}; /*from w  w  w .j ava  2s. c  o m*/

Object.defineProperty(book1, "name", { 
   enumerable : false 
}); 

console.log("name" in book1);                      // true 
console.log(book1.propertyIsEnumerable("name"));   // false 

var properties = Object.keys(book1); 
console.log(properties.length);                      // 0 

Object.defineProperty(book1, "name", { 
    configurable : false 
}); 

// try to delete the Property 
delete book1.name; 
console.log("name" in book1);                      // true 
console.log(book1.name);                           // "Javascript" 

//Object.defineProperty(book1, "name", {           // error!!! 
//    configurable : true 
//}); 

The code above generates the following result.

When JavaScript is running in strict mode, attempting to delete a non-configurable property results in an error.

In non-strict mode, the operation silently fails.

• Next »
• « Previous