如何防止 JavaScript 中对象的修改?

javascriptobject oriented programmingprogramming

ECMAScript 5 引入了几种防止修改对象的方法。这些预防措施可确保没有人意外或以其他方式更改对象的功能。

预防方法有 3 个级别

1) preventExtensions

在此级别,无法添加任何新属性或方法,但可以访问现有属性或方法。在这里可以删除相应的对象。Object.preventExtensions() 是用于完成此任务的方法。它可以防止任何新属性被添加到对象中。

示例

<html>
<body>
<script>
   var object1 = {
      prop1: 1
   };
   Object.preventExtensions(object1);
   delete object1.prop1 // value got deleted
   try {
      Object.defineProperty(object1, 'prop2', {
      value: 2
   });
   } catch (err) {
   document.write(err);
   }
   document.write("</br>");
   document.write(object1.prop1);
</script>
</body>
</html>

输出

TypeError: Cannot define property prop2, object is not extensible
undefined // deleted so undefined

2) Seal

与阻止扩展相同,此外它不允许删除现有属性或方法。要完成此任务,请使用 Object.seal() 方法。

示例

<html>
<body>
<script>
   var object1 = {
      prop1: 1
   };
   Object.seal(object1);
   object1.prop1 = 2;                 // 值已更改
   delete object1.prop1;
   try {
      Object.defineProperty(object1, 'prop2', {
      value: 2
   });
   } catch (err) {
      document.write(err);
   }
   document.write("</br>");
  document.write(object1.prop1); // 由于密封,它给出的值为 2。
</script>
</body>
</html>

输出

TypeError: Cannot define property prop2, object is not extensible
2  // because of seal the value can't be deleated but got updated

3) freeze

除了 seal 的功能之外,冻结甚至不允许访问现有属性。要冻结对象,我们使用 Object.freeze() 方法。它还可以使对象不可变

示例

<html>
<body>
<script>
   var object1 = {
      prop1: 1
   };
   Object.freeze(object1);
   object1.prop1 = 2;          //  value got updated
   delete object1.prop1;        // value got deleted
   try {
      Object.defineProperty(object1, 'prop2', {
      value: 2
   });
   } catch (err) {
      document.write(err);
   }
   document.write("</br>");
   document.write(object1.prop1);  // it gives 1 as output despite value updated to 2
</script>
</body>
</html>

输出

TypeError: Cannot define property prop2, object is not extensible
1 // because of freeze the value won't get delete and won't get update. 

相关文章