Skip to main content

JavaScript Objects

JavaScript Object freeze

Written by Published

Object.freeze stops an object being changed after it is created.

const only stops the variable being reassigned, not the object being edited.

Object.freeze is what actually locks the contents.

Example

Example

javascript

const settings = Object.freeze({ theme: "dark" });

settings.theme = "light";

console.log(settings.theme);

The assignment is ignored and the value stays dark.

In strict mode it would throw an error instead.

freeze and seal

Object.freeze prevents adding, removing or changing properties.

Object.seal prevents adding and removing, but existing properties can still change.

Object.isFrozen tells you which state an object is in.

Syntax

Syntax

javascript

Object.freeze(object);
Object.seal(object);

Both return the same object rather than a copy.

const is Not Enough

This is the point people most often miss.

Example

Example

javascript

const settings = { theme: "dark" };

settings.theme = "light";

console.log(settings.theme);

const allowed the change, because the variable still points at the same object.

Checking if Frozen

isFrozen answers directly.

Example

Example

javascript

const a = Object.freeze({ x: 1 });
const b = { x: 1 };

console.log(Object.isFrozen(a));
console.log(Object.isFrozen(b));

The output is true then false.

seal Allows Edits

A sealed object keeps its shape but its values can change.

Example

Example

javascript

const user = Object.seal({ name: "Ada" });

user.name = "Grace";
user.age = 36;

console.log(user.name);
console.log(typeof user.age);

The name changed, but the new property was refused.

Freezing is Shallow

Only the top level is locked.

Nested objects can still be changed.

Example

Example

javascript

const config = Object.freeze({ db: { host: "local" } });

config.db.host = "remote";

console.log(config.db.host);

The nested value changed, because freeze only went one level deep.

Freezing Deeply

To lock everything you have to walk the object yourself.

Example

Example

javascript

function deepFreeze(object) {
  Object.values(object).forEach(function (value) {
    if (value && typeof value === "object") deepFreeze(value);
  });
  return Object.freeze(object);
}

const config = deepFreeze({ db: { host: "local" } });
config.db.host = "remote";

console.log(config.db.host);

Now the nested value is protected too.

Complete Example

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Object.freeze</title>
</head>
<body>

  <h1>JavaScript Object.freeze</h1>

  <p id="result"></p>

  <script>
    const settings = Object.freeze({ theme: "dark", size: "medium" });

    settings.theme = "light";

    document.getElementById("result").innerHTML =
      "theme: " + settings.theme +
      "<br>frozen: " + Object.isFrozen(settings);
  </script>

</body>
</html>

Try It Yourself

Run the above example in the Try It Editor.

Try removing the freeze:

Delete Object.freeze and see the theme change to light.

Important Points

  • const stops reassignment, not property changes.
  • Object.freeze stops adding, removing and changing properties.
  • Object.seal allows changes but not additions.
  • Freezing is shallow; nested objects stay editable.
  • Object.isFrozen reports the current state.

Conclusion

Object.freeze is how you make an object genuinely read only.

The gap between const and frozen is a very common misunderstanding.

Remember that freezing only protects one level unless you go deeper yourself.