[TOC] ## 對象操作 ### delete obj.屬性 刪除key值 ``` var obj = { key1: 1, key2: 2 }; Object.keys(obj); // ['key1', 'key2'] delete obj.key1 console.log(Object.keys(obj)); //[ 'key' ] ``` ### Object.create() 對象的繼承 ``` var a ={ name:"ad" }; var b=Object.create(a) b.name//ad ``` ### ... in obj 屬性是否存在 ``` var a = {boo1:"boo11",boo2:"boo22"}; console.log("boo1" in a); //true console.log("toString" in a); //true ``` ### Obj.hasOwnProperty 判斷是否是 此對象自身的屬性 ``` Object.prototype.boo3 = "boo33" const Obj = {boo1:"boo11",boo2:"boo22"}; console.log('boo3' in Obj); //true console.log(Obj.hasOwnProperty("toString" )); //flase console.log(Obj.hasOwnProperty("boo1")); //true console.log(Obj.hasOwnProperty("boo3")); //false ``` ### for .. in 遍歷可遍歷的屬性 遍歷所有可遍歷的屬性(包括繼承的) ``` for (var p in obj) { console.log(p); } ``` 遍歷自身所有可遍歷的屬性 ``` for (var key in person) { if (person.hasOwnProperty(key)) { console.log(key); } } ``` ### set/get的用法 ``` var obj = Object.defineProperty({}, 'p', { get: function () { return 'getter'; }, set: function (value) { console.log('setter: ' + value); } }); //等價寫法(推薦) var obj = { _a:"aa", get p(){ return this.a; }, set p(v){ console.log(v + "asd"); } }; ``` ### Object.getOwnPropertyDescriptor() 可獲取屬性的描述 ``` var obj = { p: 'a' }; Object.getOwnPropertyDescriptor(obj, 'p') // Object { value: "a", // writable: true, // enumerable: true, // configurable: true // } ``` 不能用于繼承的屬性 ``` var obj = { p: 'a' }; Object.getOwnPropertyDescriptor(obj, 'toString') // undefined ``` ### Object.getOwnPropertyNames() 返回對象自身的屬性名(包括不可遍歷) 返回一個數組，成員是參數對象本身的所有屬性的鍵名，不包含繼承的屬性鍵名 ``` Object.getOwnPropertyNames(Math) [ 'abs', 'acos', 'acosh', ... ]; ``` ### Object.Key() 返回可遍歷屬性 ``` var a={} a.name=12; a.age=13; Object.keys(a));//[ 'name', 'age' ] ``` ### Object.defineProperty() 定義或者修改屬性的描述 demo:1 ``` var a ={name:"asd"} var obj = Object.defineProperty(Object,'age',{ value:"123", writable:false, enumerable:true, configurable:false, }) obj.age //123 obj.age="1233" //在嚴格模式下報錯 obj.age =123 ``` demo:2 設置 set,get 的屬性與外部修改的值不可為同一個 ``` var book={ year:4, _year : 2004, editNum:0, //修改次數 }; Object.defineProperty(book,"year",{ get: function(){ return this._year ; }, set : function(newValue){ console.log("edit ..."); this._year = 2000+newValue; this.editNum++; } }); console.log(book.year);//2004 book.year =6; console.log(book.year );//2006 console.log(book.editNum );//2 ``` 對象的屬性有幾個描述性元素 - `value` 該屬性的屬性值 默認為 `undefined` - `writable` 表示屬性值（`value`）是否可改變（即是否可寫），默認為`true` - `enumerable` 是否可以遍歷,默認`true` - `configurable` 默認為true。如果設為false，將阻止某些操作改寫該屬性，比如無法刪除該屬性(value屬性除外）。也就是說，configurable屬性控制了屬性描述對象的可寫性 - `get` 一個函數，表示該屬性的取值函數（getter），默認為undefined - `set` 一個函數，表示該屬性的存值函數（setter），默認為undefined ### Object.defineProperties defineProperty 可操作多個屬性 ``` var obj = Object.defineProperties({}, { p1: { value: 123, enumerable: true }, p2: { value: 'abc', enumerable: true }, p3: { get: function () { return this.p1 + this.p2 }, enumerable:true, configurable:true } }); obj.p1 // 123 obj.p2 // "abc" obj.p3 // "123abc" ``` #### 技巧 json .stringify() 會排除`enumerable`為`false`的屬性 ``` var a ={ name:"ad", age:123 }; Object.defineProperty(a,'name',{ enumerable:false, }); console.log(JSON.stringify(a));//{"age":123} ``` ### Object.preventExtensions() 使對象無法獲取新的屬性 ### Object.isExtensible() 判斷是否可擴展 ``` var obj =new Object(); Object.preventExtensions(obj); obj.p=1;//TOypeError: Cannot add property p, object is not extensible Object.defineProperty(obj,'p',{ //報同上的錯誤 value:1 }); Object.isExtensible(obj) /false ``` > 可刪除已有屬性 ### Object.seal() 不可添加,也不可刪除屬性 ``` var obj =new Object(); obj.p=1 Object.seal(obj) obj.a=1 //TypeError: Cannot add property a, object is not extensible delete obj.p //TypeError: Cannot delete property 'p' of #<Object> ``` > `Object.seal`實質是把屬性描述對象的configurable屬性設為false，因此屬性描述對象不再能改變了 > `Object.seal`只是禁止新增或刪除屬性，并不影響修改某個屬性的值 ### Object.isSealed(obj) 判斷是否使用了seal > 如果使用了 `seald` `Object.isExtensible(obj)` 也是返回false ### Object.freeze(obj) 無法增刪改屬性 ### Object.isFrozen() 檢查是否`freeze` ### Object.getPrototypeOf() 返回參數對象的原型 ``` var F = function () {}; var f = new F(); Object.getPrototypeOf(f) === F.prototype // true ``` ### Object.setPrototypeOf() a對象共享b對象 ``` var a={} a.name="asd" var b={} b.age=12 Object.setPrototypeOf(a,b) a.age;//12 ``` ### Object.create() 從一個實例對象生成實例對象 ``` // 原型對象 var A = { print: function () { console.log('hello'); } }; // 實例對象 var B = Object.create(A); Object.getPrototypeOf(B) === A // true B.print() // hello B.print === A.print // true ``` `Object.create`方法還可以接受第二個參數 ``` var obj = Object.create({}, { p1: { value: 123, enumerable: true, configurable: true, writable: true, }, p2: { value: 'abc', enumerable: true, configurable: true, writable: true, } }); // 等同于 var obj = Object.create({}); obj.p1 = 123; obj.p2 = 'abc'; ``` ### Object.prototype.isPrototypeOf() ``` var o1 = {}; var o2 = Object.create(o1); var o3 = Object.create(o2); o2.isPrototypeOf(o3) // true o1.isPrototypeOf(o3) // true ``` o1和o2都是o3的原型。這表明只要實例對象處在參數對象的原型鏈上，isPrototypeOf方法都返回true ### `Object.prototype.__proto__` 不推薦 ``` var obj = new Object(); obj.__proto__ === Object.prototype // true obj.__proto__ === obj.constructor.prototype // true ``` ### with 關鍵詞 在嚴格模式下不能使用 `wth`關鍵詞 ``` var a = { name: 'hello', age: 'word' } with (a){ console.log(name); //hello console.log(age); //wird } ```