[JS 基礎] 物件凍結

作者：滴滴公共前端團隊 - YXY

前言：

很多人看 Vue 2.* 版本原始碼的時候也會注意到頻繁出現的 Object.freeze()

本文我們通過學習檢視 MDN 的介紹做了一下個人總結並分享出來，如果會的同學就可以直接忽略。

正文：

Object.freeze()

凍結一個物件
凍結：
不能向這個物件新增新的屬性
不能修改其已有屬性的值
不能刪除已有屬性
不能修改該物件已有屬性的可列舉性、可配置性、可寫性
-- 這個物件永遠是不可變的。該方法返回被凍結的物件。

語法

Object.freeze(obj)

引數

obj => 將要被凍結的物件

返回值

被凍結的物件

描述

凍結物件的所有自身屬性都不可能以任何方式被修改。

資料屬性的值不可更改，訪問器屬性（有getter和setter）也同樣（但由於是函式呼叫，給人的錯覺是還是可以修改這個屬性）。

如果一個屬性的值是個物件，則這個物件中的屬性是可以修改的，除非它也是個凍結物件。

例項

var ddfe = {
    job: "fe"
};

// 正常情況，可以操作物件的屬性
ddfe.from = "beijin";
delete ddfe.from複製程式碼

var o = Object.freeze(ddfe);
// 判斷是否被凍結，這裡返回 true
console.log(Object.isFrozen(o));

// 靜默失敗，obj 沒有改變
obj.like = "iOS";複製程式碼

參考：

developer.mozilla.org/zh-CN/docs/…

developer.mozilla.org/zh-CN/docs/…

---

歡迎關注DDFE
GITHUB：github.com/DDFE
微信公眾號：微信搜尋公眾號“DDFE”或掃描下面的二維碼