參考自:https://segmentfault.com/a/1190000006191558
Object.freeze()是ES5新增的特性,可以凍結一個對象,防止對象被修改。
vue 1.0.18+對其提供了支持,對於data或vuex里使用freeze凍結了的對象,vue不會做getter和setter的轉換。
如果你有一個巨大的數組或Object,並且確信數據不會修改,使用Object.freeze()可以讓性能大幅提升。
並且,Object.freeze()凍結的是值,你仍然可以將變量的引用替換掉。舉個例子:
<p v-for="item in list">{{ item.value }}</p>
new Vue({ data: { // vue不會對list里的object做getter、setter綁定
list: Object.freeze([ { value: 1 }, { value: 2 } ]) }, mounted () { // 界面不會有響應
this.list[0].value = 100; // 下面兩種做法,界面都會響應
this.list = [ { value: 100 }, { value: 200 } ]; this.list = Object.freeze([ { value: 100 }, { value: 200 } ]); } })