JavaScript Objects and its secret associates

An Object in JavaScript is an unordered collection of properties having a name and a value. Objects are usually mutable, as the variables or identifiers that store an object is a reference rather than the value.

let a = { x: 1 };
let b = a;
b.x = 2;
console.log(a.x); // equals 2

The 2 types of properties in an object

The common property that is usually used in an object is a data property like the one in the example above. Data property names can be either strings or Symbols and the value can be anything. When a value is a function then the property is called a method.

The other type of property is an accessor property. This does not have a single value like data property but instead have one or two accessor methods known as a getter or setter. The getter is invoked when reading the value and the setter is invoked when setting the value.

let x = {
    // data property
    propName: value,

    // accessor property containing a pair of accessor functions.
    get accessorProp() { return this.propName; },
    set accessorProp(value) { this.propName = value; }
};

Data property's associates

Each data property has three associate property attributes apart from a name and a value.

• The writable attribute
• the enumerable attribute
• the configurable attribute

These property attributes tells you how that property will behave.

Accessing properties and attributes

The property's value, the getter, the setter and its attributes are stored in a data record called the property descriptor. There is also a method to expose all that is in a property descriptor and it is Object.getOwnPropertyDescriptor() and in order to create new property on an object or modify the property in the descriptor the method Object.defineProperty() is used.

const shoe = {}; // Creates a new object

// Example of an object property added
// with defineProperty with a data property descriptor
Object.defineProperty(shoe, "size", {
  value: 41,
  writable: true, //indicating that the property can be changed with an assignment
  enumerable: true,//boolean value indicating that if the property can be enumerated by for...in loop
  configurable: true,//indicating if the property can be deleted, or changed to accessor property or can have its attributes changed
});

The other object in an object

Apart from Objects own properties, almost all objects inherits the properties of another object called prototype referred to as Object.prototype.

The prototype of Object.prototype is always null and not changeable and is the only object in JavaScript that do not have a prototype.

The properties or methods that are inherited from Object.prototype include the commonly used toString() and hasOwnProperty()(which is now deprecated).

One of the controversial Object.prototype property is __proto__ which is also deprecated, which exposes the value of an Objects internal Prototype and allows it to be set to a different value and is quite different from a Prototype setter __proto__.

The whole list of Object.prototype properties can be seen in the MDN documentation.

In the forth coming blogs I want to touch upon the advantages and disadvantages of these hidden associates and its impact on security.