使用 Object.freeze() 让 JavaScript 对象不能编辑

Question

关于 如何在 JavaScript 中使对象不可变 。 ES6 const 关键字  可防止您覆盖对象，但 不会 阻止您更改对象的属性。

const obj = { answer: 42 };

// Even though `obj` is declared with `const`, you can modify
// any properties of `obj`.
obj.answer = 43;
++obj.answer;
obj.otherProperty = 'test';
Object.assign(obj, { anotherProperty: 'test2' });

// You **cannot** overwrite `obj` by assigning to it. This code
// throws an error "assignment to constant variable"
obj = { answer: 41 };

冻结对象

Object.freeze() 函数 可以冻结一个对象。 JavaScript 阻止您添加、删除或修改冻结对象的属性。

const obj = Object.freeze({ answer: 42 });

// Since `obj` is frozen, modifying any of its existing
// properties or adding a new property throws an error:
// "Cannot assign to read only property 'answer' of object '#<Object>'"
obj.answer = 43;

然而， Object.freeze() 不能冻结子对象，您仍然可以修改嵌套的对象属性。

const obj = Object.freeze({ nested: { answer: 42 } });

// Does **not** throw an error. `obj` is a frozen object,
// but `nested` is not.
obj.nested.answer = 43;

有许多用于递归冻结对象的实用程序，包括 deep-freeze 。

严格模式

非常小心依赖 Object.freeze(): Object.freeze() 不会 之外 抛出错误 严格模式 。 即使你 freeze() 使用严格模式的函数中的对象，修改该对象在严格模式之外不会抛出错误。

function strict() {
  'use strict';
  return Object.freeze({ answer: 42 });
}

function run() {
  const obj = strict();
  // No error because this function is not in strict mode
  ++obj.answer;

  obj.answer; // Still 42
}

run();