JS中Object.freeze()与Const之间的区别[每日前端夜话0x6A]

ES6 自发布以来为 JavaScript 带来了一些新功能和方法。与 JavaScript 相比，这些功能更好地改善了我们的工作流程。这些新功能包括 Object.freeze() 方法和 const。

一些开发人员尤其是新手们认为这两个功能的工作方式相同，但并不是。 Object.freeze() 和 const 的工作方式是不同的。

概述

const和Object.freeze()完全不同。

•const 的行为类似于 let，唯一的区别是它定义了一个无法重新分配的变量。由 const 声明的变量是块作用域，而不是像 var那样的函数作用域

•Object.freeze() 将一个对象作为参数，并返回与不可变对象相同的对象。这意味着你不能添加、删除或更改对象的属性。

可变对象具有可以更改的属性。不可变的对象在创建对象后没有可以更改的属性。

例子：

Const

1const user = 'Bolaji Ayodeji'2user = 'Joe Nash'

这将抛出一个 Uncaught TypeError，因为我们试图重新给用 const 关键字声明的变量 user 赋值。这是没用的。

最初，这适用于 var 或 let ，但不适用于const

const的问题

使用对象时，使用 const 仅阻止重新分配，而不是不可变性（能够阻止更改其属性）。

请考虑以下代码。我们使用 const 声明了一个变量，并为它分配了一个名为 user 的对象。

 1const user = { 2  first_name: 'bolaji', 3  last_name: 'ayodeji', 4  email: 'hi@bolajiayodeji.com', 5  net_worth: 2000 6} 7user.last_name = 'Samson'; 8// this would work, user is still mutable! 9user.net_worth = 983265975975950;10// this would work too, user is still mutable and getting rich :)!11console.log(user);  // user is mutated

虽然我们无法重新分配这个名为 object 的变量，但仍然可以改变对象本身。

1const user = {2  user_name: 'bolajiayodeji'3}4// won't work

我们肯定希望对象具有无法修改或删除的属性。但是 const 做不到，这就是 Object.freeze() 存在的意义。

Object.freeze()

要禁止对象的任何更改，我们需要 Object.freeze()。

1const user = { 2  first_name: 'bolaji', 3  last_name: 'ayodeji', 4  email: 'hi@bolajiayodeji.com', 5  net_worth: 2000 6} 7Object.freeze(user); 8user.last_name = 'Samson'; 9// this won't work, user is still immutable!10user.net_worth = 983265975975950;11// this won't work too, user is still immutable and still broke :(!12console.log(user);  // user is immutated

实际上具有嵌套属性的对象并未被冻结

好吧，Object.freeze() 有点肤浅，你需要将它递归地应用于嵌套对象来保护它们。

 1const user = { 2  first_name: 'bolaji', 3  last_name: 'ayodeji', 4  contact: { 5    email: 'hi@bolajiayodeji.com', 6    telephone: 08109445504, 7  } 8} 9Object.freeze(user);10user.last_name = 'Samson';11// this won't work, user is still immutable!12user.contact.telephone = 07054394926;13// this will work because the nested object is not frozen14console.log(user);

因此当对象具有嵌套属性时，Object.freeze() 并不会完全冻结对象。

要完全冻结对象及其嵌套属性，你可以编写自己的库或使用已有的库，如 Deepfreeze 或 immutable-js。

结论

const 和 Object.freeze() 不一样，const 阻止重新分配，Object.freeze() 阻止不变性。

谢谢你的阅读，干杯！

原文：https://medium.freecodecamp.org/the-differences-between-object-freeze-vs-const-in-javascript-4eacea534d7c

概述

例子：

结论

更多相关文章

随机推荐