JavaScript中对象处理之Object.freeze与Object.seal
发布网友
发布时间：2024-10-03 19:29
共1个回答
热心网友
时间：2024-11-23 14:01
数据不变性在编程语言中一直非常重要，在JavaScript中也是如此。在这里，有两种JavaScript方法可以部分保证不变性：Object.freeze和Object.seal。本文来总结一下这两个方法都可以用来做什么？都有什么区别？存在什么不足之处？
ObjectdefineProperty在了解freeze和seal之前，先来了解一下Object中的defineProperty方法是什么。当一个对象在初始处理过程中由引擎创建时，JavaScript将基本属性赋予新创建的对象，以处理来自外部的请求，例如访问或删除属性。
可以修改或设置的属性如下：
value：属性的值
enumerable：如果为true，则该属性可通过for-in循环或Object.keys()进行搜索，默认为false。
writable：如果为false，则无法修改该属性，它在严格模式下引发错误，默认为false。
可配置：如果为false，则这会使对象的属性不可枚举、不可写、不可删除和不可配置，默认为false。
get：当尝试访问该属性时提前调用的函数，默认为undefined。
set：当尝试为属性设置某个值时提前调用的函数，默认为undefined。
下面来看一些简单的代码：
可枚举constobj={};Object.defineProperty(obj,"a",{value:100,enumerable:false,});for(constkeyinobj){console.log(key);}//未定义Object.keys(obj);//[]可写constobj={};Object.defineProperty(obj,"a",{value:100,writable:false,});obj.a=200;obj.a===100;//真的(()=>{"usestrict";obj.a=100;//严格模式下的类型错误})();可配置constobj={};Object.defineProperty(obj,"a",{value:100,configurable:false,});//1.non-enumerablefor(constkeyinobj){console.dir(key);}//undefinedObject.keys(obj);//[//2.non-writable(()=>{"usestrict";obj.a=200;//TypeErrorinthestrictmode})();//3.non-deletabledeleteobj.a;obj.a===100;//true但是，当writable或enumerable为true时，将忽略configure:false。
Object.Seal在JavaScript中，Object.seal也和密封做同样的事情。Object.seal使传递给它的对象的所有属性都不可配置，可用于阻止向对象添加新的属性和删除属性，但允许更改和更新现有属性。，来看下面的例子：
constobj={author:"DevPoint"};console.log(Object.getOwnPropertyDescriptors(obj));/*{author:{value:'DevPoint',writable:true,enumerable:true,configurable:true}}*/Object.seal(obj);console.log(Object.getOwnPropertyDescriptors(obj));/*{author:{value:'DevPoint',writable:true,enumerable:true,configurable:false}}*/obj.author="天行无忌";console.log(obj.author);//天行无忌deleteobj.author;console.log(obj.author);//天行无忌obj.city="Shenzhen";console.log(obj.city);//undefined上面代码定义了一个对象obj有一个属性author，其中的值为DevPoint，初始的描述属性如下：
{author:{value:'DevPoint',writable:true,enumerable:true,configurable:true}}然后用Object.seal密封了对象，再次查看哪些描述符发生了变化，哪些没有，从结果看只有可配置的更改为false。
{author:{value:'DevPoint',writable:true,enumerable:true,configurable:false}}obj.author="天行无忌";尽管Object.seal后的可配置现在为false，但还是通过代码改变其属性值为天行无忌，正如之前所解释的，将可配置设置为false会使属性不可写，但是如果writable明确为true，则它不起作用。当创建一个对象并设置一个新属性时，它默认为writable:true。
deleteobj.author;Object.seal会使每个属性都不可配置，从而防止被删除。从上面的代码看，对对象执行Object.seal后，deleteobj.author;将变得无效。
obj.city="Shenzhen";当Object.seal或Object.freeze被调用时，执行后的对象将变成不可扩展的对象，这意味着不能从中删除任何属性，也不能向其中添加任何属性。
Object.freeze这比Object.seal*了传递的对象，将上面的代码进行修改，如下：
constobj={author:"DevPoint"};console.log(Object.getOwnPropertyDescriptors(obj));/*{author:{value:'DevPoint',writable:true,enumerable:true,configurable:true}}*/Object.freeze(obj);console.log(Object.getOwnPropertyDescriptors(obj));/*{author:{value:'DevPoint',writable:false,enumerable:true,configurable:false}}*/obj.author="天行无忌";console.log(obj.author);//DevPointdeleteobj.author;console.log(obj.author);//DevPointobj.city="Shenzhen";console.log(obj.city);//undefined从上面代码结果看，与Object.seal的区别在于writable在执行Object.freeze后属性值也变为false。因此后续代码对其属性进行更新都无效。同样与Object.seal一样，Object.freeze也使对象不可配置，这使得对象的每个属性都不可删除。
共同点执行后的对象变得不可扩展，这意味着对象将无法添加新属性。
执行后的对象中的每个元素都变得不可配置，这意味着无法删除属性。
如果在“使用严格”模式下调用操作，则两种方法都可能引发错误，例如在严格模式下执行obj.author="天行无忌"会出现错误。
不同对象执行Object.seal后允许修改属性，而执行Object.freeze则不允许。
不足Object.freeze和Object.seal在“实用性”方面存在不足，它们都只是对对象的第一层有效。
constobj={};Object.defineProperty(obj,"a",{value:100,writable:false,});obj.a=200;obj.a===100;//真的(()=>{"usestrict";obj.a=100;//严格模式下的类型错误})();0如果希望避免对更深层次的对象属性有效，需要像深拷贝一样，需要写一些代码来实现（deepFreeze）：
constobj={};Object.defineProperty(obj,"a",{value:100,writable:false,});obj.a=200;obj.a===100;//真的(()=>{"usestrict";obj.a=100;//严格模式下的类型错误})();1如果希望对嵌套对象实现Object.seal效果，同样需要编写代码来实现（deepSeal）：
constobj={};Object.defineProperty(obj,"a",{value:100,writable:false,});obj.a=200;obj.a===100;//真的(()=>{"usestrict";obj.a=100;//严格模式下的类型错误})();2总结Object.freeze和Object.seal在现代前端开发中是非常有用的方法，如果希望对深层有效，可以使用上面的方法deepFreeze和deepSeal。
