ES5 對象的擴展(Object.preventExtensions)、密封(Object.seal)和凍結(Object.freeze)

前面提到 ES5 對象屬性描述符，這篇看看對象的擴展、密封和凍結。

1. 擴展對象
   1. Object.preventExtensions
   2. Object.isExtensible
2. 密封對象
   1. Object.seal
   2. Object.isSealed
3. 凍結對象
   1. Object.freeze
   2. Object.isFrozen

 

1. Object.preventExtensions

阻止對象擴展，讓一個對象變的不可擴展，也就是永遠不能再添加新的屬性

 

ES3 是沒有辦法阻止對象擴展的，定義對象後能夠給對象添加任意屬性，如

var obj = {name: 'John'}

// 又添加一個屬性 age
obj.age = 30

// 又添加一個方法
obj.setAge = function(a) {
	this.age = a
}

 

ES5 的 Object.preventExtensions 則能夠阻止給對象添加新屬性

var obj = {name: 'John'}

// 阻止對象擴展
Object.preventExtensions(obj)

// 添加新屬性
obj.age = 30 

// 測試新屬性，是 undefined，代表未添加成功
console.log(obj.age)

 

若是嚴格模式，則會報錯

'use strict'
var obj = {name: 'John'}
Object.preventExtensions(obj)
obj.age = 30

如圖

 

2. Object.isExtensible

判斷一個對象是否可擴展，便是否能夠給它添加新屬性

 

默認普通對象都是能夠擴展的，這和 ES3 保持一致

var obj = {}

// true，表示可擴展
Object.isExtensible(obj)

 

但調用 ES5 的 Object.preventExtensions 後就返回 false 了

var obj = {}
Object.preventExtensions(obj)

// false，表示不可添加新屬性
Object.isExtensible(obj)

 

3. Object.seal

讓一個對象密封，並返回被密封后的對象。密封對象是指那些不能添加新的屬性，不能刪除已有屬性，以及不能修改已有屬性的可枚舉性、可配置性、可寫性，但能夠修改已有屬性的值的對象。

 

測試：添加新屬性

var obj = {name: 'John'}

// 密封
Object.seal(obj)

// 不能添加新屬性
obj.age = 30
console.log(obj.age) // undefined

 

測試：刪除已有屬性

var obj = {name: 'John'}

// 密封
Object.seal(obj)

// 不能刪除已有屬性
delete obj.name // false
console.log(obj.name) // 'John'，依然存在

 

測試：修改已有屬性的可枚舉性、可配置性、可寫性

var obj = {name: 'John'}

// 密封
Object.seal(obj)

// 修改已有的配置屬性
Object.defineProperty(obj, 'name', {
	configurable: true,
	writable: true,
	enumerable: true
})

瀏覽器提示報錯

 

測試：修改已有屬性的值

var obj = {name: 'John'}

// 密封
Object.seal(obj)

// 能夠修改已有屬性的值
obj.name = 'Backus'
console.log(obj.name) // 'Backus'

　　

4. Object.isSealed

判斷一個對象是不是密封的（sealed）

 

普通對象是非密封的，和 ES3 保持一致

var obj = {}
Object.isSealed(obj) // false

 

調用 Object.seal 的對象是密封的

var obj = {}
Object.seal(obj)
Object.isSealed(obj) // true

 

5. Object.freeze

這個方法比 Object.seal 更絕，凍結對象是指那些不能添加新的屬性，不能修改已有屬性的值，不能刪除已有屬性，以及不能修改已有屬性的可枚舉性、可配置性、可寫性的對象。也就是說，這個對象永遠是不可變的。

 

測試：添加新屬性

var obj = {name: 'John'}
Object.freeze(obj)
obj.age = 30
console.log(obj.age) // undefined

不能添加 age 屬性，代表被凍結的對象不能添加新屬性。若是是嚴格模式則報錯，如圖

 

測試：修改已有屬性

var obj = {name: 'John'}
Object.freeze(obj)
obj.name = 'Backus'
console.log(obj.name) // 'John'

想修改成 "Backus"，輸出依然是 "John"，代表不能修改已有屬性。若是是嚴格模式則報錯，如圖

 

測試：刪除已有屬性

var obj = {name: 'John'}
Object.freeze(obj)
delete obj.name
console.log(obj.name) // 'John'

想刪除 "name" 屬性，輸出依然是 "John"，代表不能刪除已有屬性。若是是嚴格模式則報錯，如圖

 

測試：修改已有屬性的可枚舉性、可配置性、可寫性

var obj = {name: 'John'}
Object.freeze(obj)
Object.defineProperty(obj, 'name', {
	configurable: true,
	writable: true,
	enumerable: true
})

這個在非嚴格模式中就報錯了，代表 configurable/writable/enmuerable 不能修改，如圖

 

6. Object.isFrozen

判斷一個對象是否被凍結（frozen）

 

普通對象是非凍結的，和 ES3 保持一致

var obj = {name: 'John'}
Object.isFrozen(obj) // false

 

調用 Object.freeze 的對象是凍結的

var obj = {name: 'John'}
Object.freeze(obj)
Object.isFrozen(obj) // true