摘要:屬性描述對象何為屬性描述對象就是用來描述對象屬性的對象,其作用就是規定了屬性的行為,即擁有屬性和方法一共有個控制屬性的屬性在介紹前必須先熟悉操作和訪問屬性描述對象的方法此方法用于獲取自身繼承的不行,也就是不能越級屬性的屬性描述對象,兩個參數
屬性描述對象 何為屬性描述對象
就是用來描述對象屬性的對象,其作用就是規定了屬性的行為,即擁有屬性和方法 一共有6個控制屬性的屬性;在介紹前必須先熟悉操作和訪問屬性描述對象的方法Object.getOwnPropertyDescriptor()
此方法用于獲取自身(繼承的不行,也就是不能越級)屬性的屬性描述對象,兩個參數,第一個參數是目標對象, 第二個參數是字符串,目標對象的屬性名 ``` var obj = {name : 123}; obj.getOwnPropertyDescriptor(obj, "name"); //{value: 123, writable: true, //enumerable: true, configurable: true} ```Object.defineProperty(),Object.defineProperties()
Object.defineProperty()
Object.defineProperty(object, propertyName, attributesObject)用于設置一個屬性的屬性描述對象,
object:目標對象
propertyName:目標對象屬性
attributesObject:要設置的屬性描述對象
var obj = Object.defineProperty({}, "p", { value : "aaa", writable : false, enumerable : true, configurable : false, })
Object.defineProperties()
Object.defineProperties()可以一次性設置多個屬性的屬性描述對象
var obj ={}; Object.defineProperties(obj1, { a : {value : 123}, b : {value : 456, enumerable : true}, }) console.log(obj); //{b : 456, a : 123}Object.prototype.propertyIsEnumerable()
Object.prototype.propertyIsEumerable(elem),作用為該屬性是否可以枚舉,填入一個字符串,(值為屬性名),返回一個布爾值;這是一個實例方法
var obj = [1, 2]; obj.name = "arr"; obj.propertyIsEnumerable("name"); //true obj.propertyIsEnumerable("length"); //false obj.propertyIsEnumerable("0"); //true6大元屬性
能控制屬性的屬性稱為元屬性
value
設置該屬性的屬性值,默認值為undefined
var obj = Object.defineProperty({}, "p", {value : 123}); obj["p"]; //123
writable
表示屬性值(value)外部能否直接賦值,writable是一個布爾值,默認值是true
在用defineProperty()設置屬性時,writable默認值為fasle;同理enumerable,configurable也是如此
var obj = Object.defineProperty({}, "p", {value : 123}); Object.getOwnPropertyDescriptor(obj, "p"); //{ value: 123, writable: false, enumerable: false, configurable: false} var obj1 = {p :123}; Object.getOwnPropertyDescriptor(obj1, "p"); //{ value: 123, writable: true, enumerable: true, configurable: true}
如值為false,外部無法直接賦值改變
var obj = {a : 1}; Object.defineProperty(obj, "a", {writable : false}); obj.a = 2; console.log(obj.a); //1,嚴格模式下這么做會報錯
enumerable
表示該屬性是否可以枚舉,即是否可以遍歷默認是值為true,如值為false,則無法被for-in,JSON.stringify以及Object.keys()
var obj = { a : 1, b : 2, c : 3, }; Object.defineProperty(obj, "a", {enumerable: false}); for(var i in obj) { console.log(i); } //b //c
configurable
其值為布爾值,決定來是否可以修改屬性描述對象,也就是當值為false時,enumerable,configurable,這兩者不能再被修改,不然會報錯:TypeError
注意點
writable只有當false改為true時會把錯,由true改為false時不會報錯
var obj = Object.defineProperty({}, "a", { value : 123, //writable : false, writable : true enumerable : true, configurable : false, }); //Object.defineProperty(obj, "a", {writable : true}) 報錯 Object.defineProperty(obj, "a", {writable :false}); //可以修改
value值只有在writable和configurable至少一個為true時才能修改不然報錯
configurable為false時則屬性不能被刪除
var obj = { a : 1, b : 2, }; Object.defineProperty(obj, "b", {configurable : false}); delete obj.a; delete obj.b; console.log(obj); //{b : 2}
get,set
get:取值,在對象取值時會跳用getter函數,默認值undefined,例如obj.a
set:存值,在對象賦值時會調用setter函數,默認值undefined,例如obj.a = 123;
注意點:當設置了set或者get元屬性時,若設置了writable,或者設置value 屬性,會報錯:Uncaught TypeError: Invalid property descriptor. Cannot both specify accessors and a value or writable attribute,
var obj = Object.defineProperty({}, "a", { get : function () { return "getter" } set : function (value) { console.log(value); }, })
寫法2:
var obj = { get a() { return "getter"; }, set a(value) { console.log(value); } } obj.a = 123;控制對象的狀態
Object.preventExtensions:能刪除修改舊屬性,不能添加新屬性 Object.seal:不能刪除舊屬性,但能賦值修改舊屬性,不能添加新屬性,相當于把configurable:false Object.freeze:不能刪除修改舊屬性,不能添加新屬性,相當于對象變為常量
var obj1 = {a : 1}; var obj2 = {a : 1}; var obj3 = {a : 1}; Object.preventExtensions(obj1); //舊屬性能刪除,能修改屬性對象value,能外部直接賦值 //obj1.a = 2; //delete obj1.a; //Object.defineProperty(obj1, "a", {value : 3}); //obj1.b = 2; //新屬性不能進行賦值 //Object.defineProperty(obj1, "b", {value : 3}); //不能添加新的屬性描述對象,會保錯 Object.seal(obj2); //舊屬性不能刪除,能修改屬性對象value,能外部直接賦值 // obj2.a = 2; //delete obj2.a; // Object.defineProperty(obj2, "a", {value : 3}); //obj2.b = 2; //新屬性不能進行賦值 //Object.defineProperty(obj2, "b", {value : 3}); //不能添加的新屬性描述對象,會保錯 Object.freeze(obj3); //舊屬性不能刪除,不能修改屬性對象value,不能外部直接賦值 obj3.a = 2; //delete obj3.a; //Object.defineProperty(obj3, "a", {value : 3}); //obj3.b = 2; //新屬性不能進行賦值 //Object.defineProperty(obj3, "b", {value : 3}); //不能添加的新屬性描述對象,會保錯
注意點:
凍結的是對象自身的屬性,但是可以通過給原型添加屬性來實現
var obj = {a :1}; Object.freeze(obj); console.log(obj.b); //undefined var obj0 = Object.getPrototypeOf(obj); obj0.b = 2; console.log(obj.b); //2
當然我們可以凍結原型
var obj = {a :1}; Object.freeze(obj); console.log(obj.b); //undefined var obj0 = Object.getPrototypeOf(obj); Object.freeze(obj0); obj0.b = 2; console.log(obj.b); //undefined
但是對于屬性值為object類型的,我們凍結的是它的地址不變,但其內容還是可以變得
var obj = {a :{b : 1}}; Object.freeze(obj); console.log(obj.a); //{b : 1} obj.a.b = 2; console.log(obj.a); //{b : 2} obj.a.c = 3; console.log(obj.a); //{b : 2, c : 3}三個檢測是否凍結的方法
Object.isExtensible:能否為對象添加新屬性
Object.isSealed:是否使用了Object.seal()
Object.isFrozen:是否使用了Object.freeze()
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/98149.html
摘要:它不區分該屬性是對象自身的屬性,還是繼承的屬性。那么我們要遍歷對象所有屬性,包括繼承以及不可遍歷的屬性,用加原型遍歷實現類似的用遞歸 Object靜態方法 Object自身方法,必須由Object調用,實例對象并不能調用 Object.getPrototypeOf() 作用是獲取目標對象的原型 function F() {}; var obj = new F(); console.lo...
摘要:繼承是面向對象編程語言中的一個重要的概念,繼承可以使得子類具有父類的屬性和方法或者重新定義追加屬性和方法等。但是在中沒有類的概念,是基于原型的語言,所以這就意味著對象可以直接從其他對象繼承。 繼承是面向對象編程語言中的一個重要的概念,繼承可以使得子類具有父類的屬性和方法或者重新定義、追加屬性和方法等。但是在Javascript中沒有類的概念,是基于原型的語言,所以這就意味著對象可以直接...
摘要:對象拷貝可遍歷屬性淺拷貝簡單的淺拷貝可以用,對存取器定義的對象也試用深拷貝屬性描述對象的拷貝這是個淺拷貝深拷貝不可遍歷屬性對象的拷貝例如拷貝獲得共同的原型,與是兄弟關系說明也繼承了原型,同級別簡潔化版 對象拷貝 可遍歷屬性 淺拷貝 if(typeof Object.prototype.copy != function) { Object.prototype.copy = fun...
摘要:文中的多為構造函數原型對象屬性為函數的專屬屬性,表示函數的原型對象。關于各種數據類型的屬性的展示對象的構造器函數該屬性指向創建該對象原型的構造函數。對對象的凍結狀態的設置和判斷,前者讓凍結對象,后者判斷對象是否被凍結。 前言 上篇文章介紹了JS的對象,本文將介紹Object這個基類,主要介紹其屬性和方法(其實這些在MDN里都有^_^,點擊這里可以直通MDN)。好了廢話不多說了,直接開始...
摘要:命令作用作用是執行構造函數,返回實例對象上面例子是自定義一個構造函數,其最大的特點就是首字母大寫,用執行構造函數其中,在的執行下,代表了實例化后的對象,這個也就有屬性注意點如果不用執行構造函數,那么指向的是全局有兩種方式可以避免內部定義嚴格 new命令 new作用 作用是執行構造函數,返回實例對象 function F() { this.name = object } var ...
閱讀 1356·2021-11-15 11:45
閱讀 3123·2021-09-27 13:36
閱讀 2867·2019-08-30 15:54
閱讀 984·2019-08-29 12:38
閱讀 2905·2019-08-29 11:22
閱讀 2983·2019-08-26 13:52
閱讀 2026·2019-08-26 13:30
閱讀 584·2019-08-26 10:37