1. Introduction

In this tutorial, we’ll discuss freeze() method of Object. The freeze() method freezes an object. Frozen object here means:

• new properties can not be added to a frozen object.
• existing properties can not be removed.
• values of existing properties of a frozen object can not changed.
• the prototype of a frozen object can not be changed.
• enumerability, configurability, or writability of existing properties of a frozen can not be changed.

Note: If you try to do any change which can not be done as mentioned in above points then the action will fail silently or will throw TypeError exception.

2. Other important points about freeze()

• freeze() method returns the same object passed to it. The freeze() method does not create a frozen copy of the passed object.
• For a frozen object the writable and configurable attributes are set to false.
• If a frozen object has object as values, these objects can still be modified unless are also frozen.
• In ES2015, a primitive argument passed to freeze() will be treated as if it were a frozen ordinary object. The freeze() will return the same argument.
• Since array is an object, no element can be added or deleted to a frozen array. You can’t modify the elements of a frozen array. If array element is an object, it can be modified unless frozen.

3. Syntax

The syntax of freeze() method is:

Object.freeze(obj)

Here, obj is the object to freeze. Following is an example of using freeze():

const employee = {
  id: 17
};

Object.freeze(employee);

4. Examples

4.1 Can’t add new properties to a frozen object

let employee = {
  id: 1,
  name: "Dummy Name",
};

Object.freeze(employee);

employee.salary = 10; // silently fails. Throws TypeError exception in strict mode

4.2 Can’t remove existing properties of a frozen object

let employee = {
  id: 1,
  name: "Dummy Name",
};

Object.freeze(employee);

delete employee.name;  // silently fails. Throws TypeError exception in strict mode

4.3 Can’t change values of existing properties of a frozen object

let employee = {
  id: 1,
  name: "Dummy Name",
};

Object.freeze(employee);

employee.name = "some other name"; // silently fails. Throws TypeError exception in strict mode

4.4 Can’t change prototype of a frozen object

let employee = {
  id: 1,
  name: "Dummy Name",
};

let parent = {};

Object.freeze(employee);

Object.setPrototypeOf(employee, parent); // TypeError is thrown

4.5 Can’t change enumerability, configurability, or writability of existing properties

let employee = {
  id: 1,
  name: "Dummy Name",
};

Object.freeze(employee);

Object.defineProperty(employee, "name", {
  configurable: true,
  writable: true,
  enumerable: true,
}); // TypeError is thrown

4.6 freeze() method returns the same object

let employee = {
  id: 1,
  name: "Dummy Name",
};

let result = Object.freeze(employee);

console.log(employee === result); // true

4.7 writable and configurable attributes are set to false in a frozen object

let employee = {
  id: 1,
  name: "Dummy Name",
};

console.log(Object.getOwnPropertyDescriptor(employee, "name").configurable); // true
console.log(Object.getOwnPropertyDescriptor(employee, "name").writable);  //true

Object.freeze(employee); // freeze employee

console.log(Object.getOwnPropertyDescriptor(employee, "name").configurable); // false
console.log(Object.getOwnPropertyDescriptor(employee, "name").writable); // false

4.8 Frozen object’s object values can be modified

let employee = {
  id: 1,
  name: "Dummy Name",
  address: {
    country: "dummy country",
    state: "dummy state",
  },
};

Object.freeze(employee); // freeze employee

employee.address.country = "some other country";

console.log(employee);

Output
-------
{
  id: 1,
  name: 'Dummy Name',
  address: { country: 'some other country', state: 'dummy state' }
}

4.9 Primitive argument to freeze() method

In ES2015, when primitive argument is passed to freeze(), it is treated as ordinary frozen object. In ES5 primitive argument with freeze() will throw TypeError.

let result = Object.freeze(17);
console.log(result); //17 in ES2015

4.10 freeze() with Arrays

Since array is an object, it can be freeze. You can’t add or remove element from a frozen array. Element of an array can not be modified unless it is an object. If the object element of an array is frozen, it can not be modified like any other frozen object.

let emp1 = {
  id: 1,
};

let emp2 = {
  id: 2,
};

//create empty array
let arr = [];

//push elements to array
arr.push(emp1);
arr.push(emp2);
arr.push(3);

//freeze the array
Object.freeze(arr);


arr.push(3); // add element not allowed in a frozen array

arr.splice(1, 1); // remove element not allwoed in a frozen array

arr[0].id = 5; // object element of frozen array can be modified

arr[2] = 17; // silents fails. TypeError is thrown in strict mode