[Cheat Sheet] Javascript – Object Model

Note: This is part of Javascript learning roadmap.

  • the only reference data type in JS (var obj –  holds the reference to that object)
    • all other reference types inherit from Object (including function)
  • represented in memory as a dictionary – unordered list of primitive data types (and sometimes reference data types) stored as a series of name-value pairs
  • trying to access a property which does not exist will result in undefined (not null)

 


Object Properties

  • property names can be any string, including empty
  • if the property name is a valid JS identifier, it can be accessed with ‘.’ – car.name
  • if property name is not a valid JS identifier (ex number, empty string) – it can be accessed only via ‘[]’ – car[0], car[‘’], car[‘!’]
  • each data property (object property that store data) has not only the name-value pair, but also 3 attributes (the three attributes are set to true by default):
    • Configurable Attribute: Specifies whether the property can be deleted or changed
    • Enumerable: Specifies whether the property can be returned in a for/in loop. (or if it can be serialized)
    • Writable: Specifies whether the property can be changed

 


Creating objects

  • object literals
// This is an empty object initialized using the object literal notation
var obj = {} 

// This is an object with 4 items, again using object literal
var mango = {
  color: "yellow",
  shape: "round" 
  sweetness: 8
  isMango: function() {
      return true; // of course it's mango
  }
}
  • Object constructor
var obj = new Object() // not recommended
  • Constructor and Prototype Pattern (will be cover in a separate article)

 


Own and inherited properties

  •  own properties are properties defined on the object
  •  inherited properties were inherited from the object’s Prototype object
  •  for checking if a certain property exist on an object (either as an inherited or an own property), you use the in operator
  • for checking if an object has a specific property as one of its own property, the hasOwnProperty() method can be used

 


Delete property

  • delete operator
  • can’t delete inherited properties or properties with their attributes set to configurable

 


Serialize objects

Json.stringify(obj)

 


Deserialize objects

var obj = JSON.parse(string)

 


Enumerate the properties of an object

  • for…in loops
    • This method traverses all enumerable properties of an object and its prototype chain
  • Object.keys(o) 
    • This method returns an array with all the own (not in the prototype chain) enumerable properties’ names (“keys”) of an object o.
  • Object.getOwnPropertyNames(o) 
    • This method returns an array containing all own properties’ names (enumerable or not) of an object o.

 


Creating getters and setters

  • JS allows declaring them either at initialization (in object literal) or after initialization
  • object literal:
var o={
  a:7,
  get b() { return this.a+1; },
  set c(x) { this.a = x/2; }
};
  • after object initialization
var o = {a: 0};
Object.defineProperties(o, {
   'b': { get: function()  { return this.a + 1;} },
   'c': { set: function(x) { this.a = x / 2;} }
});
o.c = 10; // Runs the setter, which assigns 10 / 2 (5) to the 'a' property
console.log(o.b); // Runs the getter, which yields a + 1 or 6

 

Thank you for your time!

Please subscribe for more weekly web wisdom!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s