vue中Object.freeze()

最新推荐文章于 2022-09-03 09:45:06 发布
最新推荐文章于 2022-09-03 09:45:06 发布
阅读量1.2k 收藏
点赞数
分类专栏： vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44090040/article/details/113176609
版权

- Object.freeze() 方法

可以冻结一个对象，冻结指的是不能向这个对象添加新的属性，不能修改其已有属性的值，不能删除已有属性，以及不能修改该对象已有属性的可枚举性、可配置性、可写性。该方法返回被冻结的对象。

- Object.freeze()存在的意义
如果你有一个巨大的数组或Object，并且确信数据不会修改，使用Object.freeze()可以让性能大幅提升。在我的实际开发中，这种提升大约有5~10倍，倍数随着数据量递增,对于纯展示的大数据，都可以使用Object.freeze提升性能。

辣条小哥哥
关注
专栏目录
vue性能优化之Object.freeze()
weixin_49343253的博客
06-22 585
Object.freeze(obj)可以冻结一个对象，该对象的属性不能再被修改增添，响应系统无法追踪它的变化 当有一个数组或者对象，里面的内容一定不发生改变，那么就可以在data、vuex里冻结它，这样性能可以大大提高 <p v-for="item in list">{{ item.value }}</p> new Vue({ data: { // vue不会对list里的object做getter、setter绑定 lis...
VUE中的Object.freeze
weixin_46382167的博客
10-08 853
场景:一个长列表数据,一般不会更改,但是vue会做getter和setter的转换 用法:是ES5新增的特性，可以冻结一个对象，防止对象被修改 支持:vue 1.0.18+对其提供了支持，对于data或vuex里使用freeze冻结了的对象，vue不会做getter和setter的转换 注意:冻结只是冻结里面的单个属性,引用地址还是可以更改 new Vue({ data: {// vue不会对list里的object做getter、setter绑定 list: Object.
Vue----Object.freeze()
菜同学的博客
07-15 934
1.参数为对象 Object.freeze()方法可以冻结一个对象，被冻结的对象再也不能被修改。不能向被冻结对象中添加新的属性，不能删除已有的属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，修改已有属性的值。冻结对象的原型也不能被修改。 Object.freeze()返回和传入的参数是相同的,返回的是传递的对象，而不是创建一个被冻结的副本 <template> ...
Vue性能提升之Object.freeze()
muzidigbig的博客
12-24 8053
一、序 在 Vue 的文档中介绍数据绑定和响应时，特意标注了对于经过 Object.freeze() 方法的对象无法进行更新响应。因此，特意去查了 Object.freeze() 方法的具体含义。 二、含义 Object.freeze() 方法用于冻结对象，禁止对于该对象的属性进行修改（由于数组本质也是对象，因此该方法可以对数组使用）。在 Mozilla MDN 中是如下介绍的： 可以冻结一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修
vue Object.freeze() 优化
weixin_34138255的博客
05-24 448
参考自：https://segmentfault.com/a/1190000006191558 Object.freeze()是ES5新增的特性，可以冻结一个对象，防止对象被修改。 vue 1.0.18+对其提供了支持，对于data或vuex里使用freeze冻结了的对象，vue不会做getter和setter的转换。 如果你有一个巨大的数组或Object，并且确信数据不会修改，使用Obje...
vue的Object.freeze()
YmwWow的博客
07-06 1123
在vue中使用Object.freeze()，这会阻止修改现有的属性 <body> <div id="app"> <p>{{obj.foo}}</p> </div> <script> var obj = { foo:'bar' } Object.freeze(obj) var...
Vue.js中的Object.freeze
qq_17285877的博客
12-27 376
Vue.js中的Object.freeze问题描述冻结在前冻结在后暂未解决 问题描述 在复习Vue的过程中，实验到Object.freeze的时候出现问题——具体表现为Object.freeze和创建Vue实例的语句的位置关系会影响冻结是否有效。 冻结在前 <!DOCTYPE html> <html> <head> <title>test</...
Object.freeze()学习
weixin_42464106的博客
07-29 1018
不能再向这个对象添加新的属性，不能修改原有属性值，不能删除已有属性，不能修改已有属性的可枚举性、可配置性、可写性。如果对象内容很多，都是静态数据，而且不会修改它，那可以用Object.freeze()冻结起来。这样可以让性能大幅度提升，提升的效果随着数据量的递增而递增。对于纯展示的大数据，都可以使用Object.freeze提升性能。在vue项目中,data初始化里面一般会有很多变量,后续如果不想使用它,可以使用Object.freeze()。data(){return{list文章地址。...
Object.freeze()
棠樾的博客
08-26 422
Object.freeze()方法可以冻结一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，以及不能修改已有属性的值。此外，冻结一个对象后该对象的原型也不能被修改。freeze()返回和传入的参数相同的对象。 语法： Object.freeze(obj) // obj 参数 要被冻结的对象。 返回值：被冻结的对象 被冻结对象自身的所有属性都不可能以任何方式被修改。任何修改尝试都会失败..
前端性能优化-番外篇-Object.freeze到底用在哪
Beam
06-21 2055
对于前端纯大数据展示，不需要做修改其中字段等处理的，使用Object.freeze方法来包裹变量，vue内部不再去监听数据的变化提高性能。 话是这么说，官方资料这么写： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze 但是，问题又来了，这个Object.fr...
从 Vue 文档中延伸的 Object.freeze()
Jackie_Rose的博客
06-05 361
序： 在 Vue 的文档中介绍数据绑定和响应时，特意标注了对于经过Object.freeze() 方法的对象无法进行更新响应。因此，特意去查了 Object.freeze() 方法的具体含义。 含义： Object.freeze() 方法用于冻结对象，禁止对于该对象的属性进行修改（由于数组本质也是对象，因此该方法可以对数组使用）。在 Mozilla MDN 中是如下介绍的： 可以冻结一...
Object.freeze()详解——只支持浅冻结-冻结对象的直接属性，不支持深冻结-对象的对象不支持冻结 & vue中定义常量文件和导入常量文件
weixin_44867717的博客
09-03 5448
js
vue开发技巧——object.freeze使用
weixin_38222139的博客
11-28 1153
vue开发技巧——object.freeze使用
Object.freeze()详解
热门推荐
cai_niao5623的博客
11-02 1万+
我们都知道const定义基本数据类型，这个值是不可以修改的。那么我们用const定义对象，可以修改对象吗？ const a = 5 // a = 10 // TypeError: Assignment to constant variable. const obj = { name: '张三' } obj.name = '李四' console.log(obj) // {name: "李四"} 答案是肯定的。那么如果我们想定义一个不可被修改的对象，应该怎么办呢！那就要用到Object.
vue中Object.freeze() 优化数据
Boboy
11-27 7438
freeze翻译成汉语有冻结的意思使用 ,Object.freeze()是ES5新增的特性，可以冻结一个对象，这会阻止修改现有的属性，也意味着响应系统无法再追踪变化。 来看他的定义：Object.freeze() 方法可以冻结一个对象，冻结指的是不能向这个对象添加新的属性，不能修改其已有属性的值，不能删除已有属性，以及不能修改该对象已有属性的可枚举性、可配置性、可写性。该方法返回被冻结的对象。 ...
Vue中的Object.freeze(obj)
qq_33674454的博客
06-17 1542
Object.freeze() 方法可以冻结一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，以及不能修改已有属性的值。此外，冻结一个对象后该对象的原型也不能被修改。 再点击BUTTON后，foo由“sss”变为“zzz”。如果现在，我想冻结app这个对象，则需要加入Object.freez...
vue项目性能优化之——Object.freeze()
web前端学习总结
07-17 2179
如果你有一个巨大的数组或Object，并且确信数据不会修改，通过 Object.freeze 方法来冻结一个对象，可以让性能大幅提升。 Object.freeze() 方法可以冻结一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，以及不能修改已有属性的值。此外，冻结一个对象后该对象的原型也不能被修改。freeze() 返回和传入的参数相同的对象。 在vue中的data或者vuex里使用Object.
vue+object.freeze
你如今的气质里，藏着你走过的路，经历过的事，读过的书，和爱过的人。
10-17 182
场景:一个长列表数据,一般不会更改,但是vue会做getter和setter的转换 用法:是ES5新增的特性，可以冻结一个对象，防止对象被修改 支持:vue 1.0.18+对其提供了支持，对于data或vuex里使用freeze冻结了的对象，vue不会做getter和setter的转换 注意:冻结只是冻结里面的单个属性,引用地址还是可以更改。 new Vue({ data: { ...
vue项目中使用Object.freeze()来优化列表，附带性能分析截图
九段刀客的博客
10-15 964
看了大佬的博客https://juejin.im/post/6844903913410314247vue项目性能优化里面提到如果是纯粹用来列表展示不需要改变里面属性的数据，可以用Object.freeze()冻结对象，避免被Object.defineProperty数据劫持，从而来实现优化。下面我写了个简单的demo，通过断点调试的方式来验证了一下， <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT
vue中this.$set报错
最新发布
08-26
在 Vue 中，`this.$set` 是用来在响应式对象上动态添加属性并确保其响应性的方法。如果你在使用 `this.$set` 时遇到了报错，可能是因为你没有正确地使用它或者在错误的上下文中使用它。 以下是一些常见导致报错的情况和解决方案： 1. 错误使用语法：确保正确使用 `this.$set` 的语法。通常，`this.$set` 方法接受三个参数：对象、属性名和属性值。例如： ```javascript this.$set(this.obj, 'propertyName', value); ``` 请检查你的代码是否遵循这个语法。 2. 非响应式对象：`this.$set` 只能用于 Vue 的响应式对象。如果你尝试在普通的 JavaScript 对象上使用 `this.$set`，将会导致报错。确保你要添加属性的对象是 Vue 组件的 data、computed 或 props 中的一个。 3. 异步更新问题：Vue 的响应式系统通常在下一个事件循环中异步更新状态。如果你在同一个事件循环中多次调用 `this.$set`，可能会导致报错。如果你需要多次更新对象的属性，请考虑使用 `Vue.set` 方法而不是 `this.$set`。 ```javascript Vue.set(this.obj, 'propertyName', value); ``` 4. 对象已被冻结：如果你试图向一个被冻结的对象添加属性，也会导致报错。确保你要更新的对象没有被 `Object.freeze` 冻结。 尝试检查以上情况，看是否能解决你遇到的问题。如果问题仍然存在，请提供更多的代码细节和报错信息，以便我们能够帮助你找到问题所在。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值