javascript - javascript 对象是否可以具有常量值？

Question

我是 javascript 的初学者，我尝试坚持良好的编程实践，例如使用常量来表示不会改变的值。

例如，我想将设置存储在常量中:

const settings = {};
settings.backgroundColor = '#FFF'; 
settings.textColor       = '#333'; 
settings.shadowColor     = '#DDD'; 

我注意到，即使“设置”是一个常量，我也可以稍后在程序执行期间重新分配其他值，例如我可以在此处重新分配值而不会触发错误:

settings.backgroundColor= '#FFF';
if ( test === 1) {
    // my block of code
}
settings.backgroundColor= '#F00';
settings.backgroundColor= '#00F';
settings.backgroundColor= '#123';

此代码有效，控制台不会抛出任何类型的错误。

有没有办法将实际常量存储在我的对象“常量设置”中？

我尝试过，但没有成功:

const settings = {};
const settings.backgroundColor = '#123';
const settings.textColor       = '#333'; 
const settings.shadowColor     = '#DDD'; 

它抛出错误“未捕获的语法错误:标识符'设置'已被声明”

这个问题并不是很重要，因为我的代码可以正常工作，我只是尝试有良好的开发实践。

感谢您的帮助!

Answer 1

这可以通过将对象传递给 Object#freeze 方法来实现。

来自 MDN docs :

The Object.freeze() method freezes an object. A frozen object can no longer be changed; freezing an object prevents new properties from being added to it, existing properties from being removed, prevents changing the enumerability, configurability, or writability of existing properties, and prevents the values of existing properties from being changed. In addition, freezing an object also prevents its prototype from being changed. freeze() returns the same object that was passed in.

const settings = {};
settings.backgroundColor = '#FFF'; 
settings.textColor       = '#333'; 
settings.shadowColor     = '#DDD';

Object.freeze(settings)

settings.textColor = "#FFF";
console.log(settings)

settings.newColor = "#FFF";
console.log(settings)

delete settings.textColor
console.log(settings)

注意 - 上面的操作在严格模式下抛出TypeError

上述方法对对象进行了浅层卡住，但可以修改任何子对象属性:

const obj1 = {
  internal: {}
};

Object.freeze(obj1);
obj1.internal.a = 'aValue';

console.log(obj1.internal.a)

要卡住整个对象图，您需要递归地卡住对象的各个对象属性:

function deepFreeze(object) {
  // Retrieve the property names defined on object
  const propNames = Object.getOwnPropertyNames(object);
  // Freeze properties before freezing self
  propNames.forEach(name => {
    const value = object[name];

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

const obj2 = {
  internal: {
    a: null
  }
};

deepFreeze(obj2);

obj2.internal.a = 'anotherValue'; 
console.log(obj2.internal.a)