前面提到 ES5 對象屬性描述符,這篇看看對象的擴展、密封和凍結。 阻止對象擴展,讓一個對象變的不可擴展,也就是永遠不能再添加新的屬性 ES3 是沒有辦法阻止對象擴展的,定義對象後可以給對象添加任意屬性,如 ES5 的 Object.preventExtensions 則可以阻止給對象添加新屬性 如
前面提到 ES5 對象屬性描述符,這篇看看對象的擴展、密封和凍結。
- 擴展對象
- Object.preventExtensions
- Object.isExtensible
- 密封對象
- Object.seal
- Object.isSealed
- 凍結對象
- Object.freeze
- 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