讲解冻结JS对象方法技术

3403771864 发布于2022-10-09 21:55 / 377人阅读

　　我们现在讲讲冻结JS对象方法技术吧，下面举例相关代码。我们一起来学习学习吧！

　　冰封的美人——冻结JS对象

　　现在我们了解下JS对象

　　js对象是普通对象，键值对方式，且其属性不加引号，表示方法如下，对象内有对象属性，对象方法和普通的对象概念相同

　　var obj = {
　　name : "cxy",
　　age : "18"
　　}

要是只是修改对象的属性，obj.name = "juejin"即可console.log(obj.name)就可以解决，但如何处理冻结？看下Object.freeze()

　　Object.freeze

　　翻译下freeze的意思，由此得知freeze()是用来冻结对象的方法，我们只需要将我们要冻结的目标对象作为参数传递给他，那么该对象就会被冻结

　　const iceObj = Object.freeze(obj)

　　这样iceObj就是被冻结的对象，那冻结是什么？但当我们变动对象的age属性iceObj.age = "19"，然后再运行就会发现console.log(iceObj.age)，发现omygod，结果还是18，不愧是永远十八岁的冰封美人，除此之外还有一个检验对象冻结的方法即Object.isFrozen，返回值为布尔值

　　不可冻结的对象

　　又有新的问题了，难不成所有的对象都可以被冻结吗？nonono，Object.freeze()不可冻结嵌套对象，依旧是那个对象，但是有一个son属性本身又是一个对象

　　var obj = {
　　name : "cxy",
　　age : "18"
　　son : {
　　name : "son",
　　age : "1"
　　}
　　}

　　我们来修改并打印一下son中的name属性，会发现其属性值是修改后的值，所以说Object.freeze()并不是所有对象都能冻住的，当然其object.freeze()还可以冻结数组，大家可以定义一个数组，冻结之后，使用下标修改看看效果如何，除此之外还有一共冻结方法即object.seal()它和object.freeze()有差别，我们来看一下

　　Object.seal

　　var obj = {
　　name : "cxy",
　　age : "18"
　　}
　　const iceObj = Object.seal(obj)
　　iceObj.name = "juejin"
　　delete iceObj.age
　　console.log(iceObj)

　　对象还是那个对象，在先使用object.seal()冻结再执行修改name属性，删除age属性的操作，在运行之后就明白了name属性成功被修改，但是age属性没有被删除，这就是和freeze()不一样的地方，即可以修改属性值，但是不可以删除属性值，当然同样它还有一个检验对象冻结的方法即Object.isSealed，返回值为布尔值，最后还有一种冻结的方法即Object.preventExtensions()

　　Object.preventExtensions

　　Object.preventExtensions是冻结对象增加属性的能力

　　var obj = {
　　name : "cxy",
　　age : "18"
　　}
　　const iceObj = Object.preventExtensions(obj)
　　iceObj.weight = "180"
　　console.log(iceObj)

　　我们可以看到上述代码，其中obj新增weight属性，运行却没有显现出来，也就是说对象添加属性方法被冻结了。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/127974.html

面试宝典

摘要：有谈谈面试与面试题对于前端面试的一些看法。动态规划算法的思想及实现方法帮大家理清动态规划的解决思路以及原理方法前端经典面试题从输入到页面加载发生了什么这是一篇开发的科普类文章，涉及到优化等多个方面。极客学院前端练习题道练习题，面试季练练手。由数据绑定和排序引入的几个 JavaScript 知识点在 JavaScript 的数据绑定和做简单的表格排序中遇到的几个知识点 [[JS 基础...

neu 2019-08-29 14:00 评论0 收藏0
immer.js 实战讲解文档

摘要：无奈网络上完善的文档实在太少，所以自己写了一份，本篇文章以贴近实战的思路和流程，对进行了全面的讲解。这使得成为了真正的不可变数据。的使用非常灵活，多多思考，相信你还可以发现更多其他的妙用参考文档官方文档文章在 github 开源，欢迎 Fork 、Star 前言 Immer 是 mobx 的作者写的一个 immutable 库，核心实现是利用 ES6 的 proxy，几乎以最小的成...

zhiwei 2019-08-23 13:54 评论0 收藏0
听飞狐聊JavaScript设计模式系列02

摘要：本回内容介绍上一回聊到数据类型，简单的过了一遍，包括个数组新特性等，这一回来聊聊对象，结合数组来实战一些例子，在做题中成长，记忆会更深刻，来吧，开始咯创建实例的方式有两种使用操作符后跟构造函数飞狐使用对象字面量表示法飞狐也可以飞狐这种写法与本回内容介绍上一回聊到JS数据类型，简单的过了一遍，包括9个数组新特性等，这一回来聊聊Object对象，结合数组来实战一些例子，在做题中成长，记...

tangr206 2019-08-21 10:44 评论0 收藏0
javascript知识点

摘要：模块化是随着前端技术的发展，前端代码爆炸式增长后，工程化所采取的必然措施。目前模块化的思想分为和。特别指出，事件不等同于异步，回调也不等同于异步。将会讨论安全的类型检测惰性载入函数冻结对象定时器等话题。 Vue.js 前后端同构方案之准备篇——代码优化目前 Vue.js 的火爆不亚于当初的 React，本人对写代码有洁癖，代码也是艺术。此篇是准备篇，工欲善其事，必先利其器。我们先在代...

Karrdy 2019-08-26 11:34 评论0 收藏0
关于JavaScript对象，你所不知道的事（二）- 再说属性

摘要：但好在还给我们提供了一个方法，每一个对象都有这样一个方法，专门用来判断某个属性是否是该对象的私有属性。如果你想要用对象字面形式，你只能在创建对象时定义访问器属性。在中，我们使用冻结一个对象，并且使用来判断一个对象是否被冻结。说完了对象那些不常用的冷知识，是时候来看看JavaScript中对象属性有哪些有意思的东西了。不出你所料，对象属性自然也有其相应的特征属性，但是这个话题有点复杂...

Richard_Gao 2019-08-21 17:49 评论0 收藏0