本文簡介

點贊 + 關註 + 收藏 = 學會了

ES6 推出的 const 可以定義常量。在 JS 中，常量是不可改變的。這個 “不可改變” 指的是常量存放的記憶體地址不變。

眾所周知，使用 const 定義的常量，如果是基礎類型的數據，值不能變。但如果是引用類型的數據（比如對象、數組等），是可以修改裡面的元素。所以有時候看上去常量並不那麼“常量”。

但我們還是有辦法讓常量變成真正的 “常量”。

“可變” 的常量

記憶體分為 棧記憶體（stack） 和 堆記憶體（heap）。

JS 的基礎類型數據存在 棧記憶體 里；引用類型數據存在 堆記憶體 里。但引用類型的數據，比如對象，對象的 key 是存到棧記憶體 里，棧記憶體 中存放了一個引用地址，這個引用地址指向存放在 堆記憶體 的值。

所以用 const 創建一個對象常量時，只要不改變 引用地址 就不會報錯。

舉個例子

const obj = {
    name: '雷猴'
}

obj.name = '鯊魚辣椒'

console.log(obj) // 輸出: {name: '鯊魚辣椒'}

有沒有覺得上面的代碼看上去並不那麼 “常量” ？

凍結對象

如果要將 const 創建的對象設置為不可變，可以使用 Object.freeze 。

freeze 就有凍結的意思。它會將一個普通對象轉化為一個不可變對象，也就是說 不能為這個對象添加新的屬性、刪除已有屬性，也不能修改已存在的屬性。

const obj = {
  nickname: '雷猴',
  skill: {
    name: '凌波微步',
    describe: '跑不快的，沒啥用的功夫'
  }
}

// 淺層凍結
Object.freeze(obj)

obj.nickname = '鯊魚辣椒'

console.log(obj.nickname) // 輸出: 雷猴

obj.skill.name = '大象踢腿'

console.log(obj.skill) // 輸出: {name: '大象踢腿', describe: '跑不快的，沒啥用的功夫'}

但 Object.freeze 只能 “淺層凍結” ，如果對象的某個屬性也是對象，那就凍不住了。

如果要凍結深層次對象，可以用遞歸來操作。

推薦閱讀