Object.freeze() vs Object.seal() vs Object. preventExtensions()

ECMAScript 5 introduced new Object methods to Javascript. Among them Object.freeze(), Object.seal(), Object.preventExtensions() methods will be discussed in comparison to each other.

Before understanding the meanings of each method, it is important to know basic object structure.

Object Structure

An Object is a Javascript data type which can represent an entity containing certain properties or behaviors/methods. These properties can be changed or deleted or new properties can be added to the object.

There are two types of properties in an object.

Data properties — The normal object properties defined on objects.

Accessor properties — Functions that enable getting and setting object property values. Simply getter and setter methods. These properties can be recognized as get and set in front of property name.

Example:

let person = {
  firstName: "James",
  lastName: "Bond",

  get fullName() {
    return `${this.firstName} ${this.lastName}`;
  },

  set fullName(name) {
    [this.firstName, this.lastName] = name.split(" ");
  }
};

// set fullName is executed with the given name value.
person.fullName = "Jane Iyer";

console.log(person.firstName); // Jane
console.log(person.lastName); // Iyer

Any object we create inherits properties of JavaScript Object constructor. Object.prototype is one of the properties inherited by any such object. By using prototype property we can add new properties or methods to all existing objects. Can modify what is purely owned by objects without inheriting from the Object.prototype.

Example:

let person = {
  firstName: "James",
  lastName: "Bond"
}

A property(data property) has a name and a value assigned to it as a key-value pair. In addition, each property has some meta data which can control its state/value.

enumerable — Boolean value true/false. If set to true property can be enumerated/listed in loops. Otherwise not.

configurable — Boolean value true/false. If set to true property can be reconfigured. Otherwise not.

writable — Boolean value true/false. If set to true property can be changed. Otherwise not.

By default all properties are readable. Depending on above metadata its properties can be mutated.

In contrast, Accessor properties have no value. They have get, set functions which control the property accessibility.

get — A function which has no arguments and invoked upon property read.

set — A function having single argument and invoked upon property set.

enumerable — Boolean value true/false. If set to true property can be enumerated/listed in loops. Otherwise not.

configurable — Boolean value true/false. If set to true property can be reconfigured. Otherwise not.

There is no writable for accessor properties.

Object.freeze()

Object.freeze() simply converts an object passed as the argument into a frozen state. An object called by this method can not have any further changes on it.

Example:

Object.freeze(person)

Cannot add new properties.

Cannot remove existing properties.

Cannot change existing property values.

Cannot reconfigure any existing property. writable and configurable are set to false.

Cannot change its prototype.

Trying to make any changes mentioned above after an object being frozen will fail and will throw errors in strict mode.

Object.isFrozen() is an Object method to check if an object is frozen by passing the object as the argument.

Example:

Object.isFrozen(person)

Object.seal()

Object.seal() simply converts an object passed as the argument into a sealed state. An object called by this method can not have any new properties being added. But it can change existing property values as long as writable metadata is true.

Example:

Object.seal(person)

Cannot add new properties.

Cannot remove existing properties.

Cannot reconfigure any existing property.

Cannot convert a data property to accessor property or vice versa.

By default objects are extensible in the sense that new properties can be added. Trying to make any changes mentioned above after an object being sealed will fail and will throw errors in strict mode.

Object.isSealed() is an Object method to check if an object is sealed by passing the object as the argument.

Example:

Object.isSealed(person)

Object.preventExtensions()

Object.preventExtensions() simply converts an object passed as the argument into a non-extensible state. An object called by this method can not have any new properties being added. This method inherits functionality from its superset object.seal. Hence, it can change existing property values as long as writable metadata is true. In contrast to sealed objects, non-extensible objects can be deleted or reconfigured.

Example:

Object.preventExtensions(person)

Trying to add new properties after an object being non-extensible will fail and will throw errors in strict mode.

Object.isExtensible() is an Object method to check if an object is extensible by passing the object as the argument.

Example:

Object.isExtensible(person)

Note: Objects which stand as a property within an object or inner/child objects of an object can be modified unless there are separately sealed/frozen. In other words that object freeze/seal controls any changes to object properties shallowly, meaning that the direct property references cannot be changed. But properties nested inside direct object properties objects can be changed.

Example:

let person = {
  firstName: "James",  // firstName cannot be changed when frozen
  lastName: "Bond",    // lastName cannot be changed when frozen
  marks: {             // marks cannot be changed when frozen
    mathematics: 90,   // mathematics can be changed when frozen
    science: 89        // science can be changed when frozen
  }
}