1.屬性的簡潔表示法 function f(x,y) { return {x,y}; } // 等同於 function f(x,y){ return {x:x,y:y}; } f(1,2) // Object {x:1,y:2} 例如： let birth = '2000/01/01'; cons ...
1.屬性的簡潔表示法 function f(x,y) { return {x,y}; } // 等同於 function f(x,y){ return {x:x,y:y}; } f(1,2) // Object {x:1,y:2} 例如： let birth = '2000/01/01'; const Person = { name: '張三'， // 等同於 birth: birth birth, // 等同於hello: function()... hello() {console.log('我的名字'，this.name);} }; 例如：用於函數的返回值 function getPoint() { const x = 1; const y = 10; return {x,y}; } console.log(getPoint()); // {x:1,y:10} 2.屬性名錶達式 表達式作為對象的屬性名 let obj = { [propKey]: true, ['a' + 'bc']:123 }; console.log(obj[propKey]); // true console.log(obj['abc']); // 123 例如： let lastWord = 'last word'; const a = { ‘first word’: 'hello', [lastWord]: 'world' } console.log(a['first word']); // "hello" console.log(a[lastWord]); // "world" console.log(a['last word']); // "world" 例如： 表達式可以用於定義方法名 let obj = { ['h'+'ello']() { return 'hi'; } }; console.log(obj.hello()); // 'hi' 3.方法的 name 屬性 例如：函數的name 屬性，返回函數名。 const person = { sayName() { console.log('hello'); } } console.log(person.sayName.name); // "sayName" 4.Object.is() ES 比較兩個值是否相等，只有兩個運算符，相等運算符，相等運算符(==) 和嚴格相等運算符（===） +0 === -0 // true NaN === NaN // false Object.is(+0,-0); // false Object.is(NaN,NaN) // true 5.Object.assign() Object.assign 方法用於對象的合併，將源對象的所有的可枚舉屬性，賦值到目標對象 例如; const target = {a:1}; const source1 = {b:2}; const source2 = {c:2}; Object.assign(target,source1,source2); console.log(target); // {a:1,b:2,c:3} 例如：同名屬性的替換，當遇到同名屬性的時候，處理方法是替換。 const target = {a:{b:'c',d:'e'}} const source = {a: {b:'hello'}} console.log(Object.assign(target,source)) // {a: {b:'hello'}} 例如： 數組的處理 Object.assign 可以用來出來數組，把數組作為對象看 Object.assign([1,2,3],[4,5]) // [4,5,3] 常見用途(1) 為對象添加屬性 class Point { constructor(x,y){ Object.assign(this,{x,y}); } } 常見用途(2) 為對象添加方法 Object.assign(SomeClass.prototype,{ someMethod(arg1,arg2){ ..... } anotherMethod(){ ... } }) 常見用途(3) 克隆對象 function clone (origin) { return Object.assign({},origin); } 6.屬性的可枚舉行和遍歷 可枚舉性 Object.getOwnProperDescriptor 方法可以獲取該屬性的描述對象 let obj = {foo:123}; Object.getOwnPropertyDescriptor(obj,'foo') // { value: 123, writable: true, enumerable: true, configurable:true } 描述對象的enumerable 屬性，稱為“可枚舉屬性” 如果該屬性的值為false, 就表示會忽略當前屬性。 目前有四個操作會忽略 enumerable 為false 屬性。 for...in ， Object.keys(), JSON.stringify(), Object.assign(); ES6一共有5種方法可以遍歷對象的屬性 (1) for ... in 迴圈遍歷對象自身的和繼承的可枚舉屬性 (2) Object.keys(obj) Object.keys 返回一個數組，包括對象自身的所有可枚舉屬性 (3) Object.getOwnPropertyNames(obj) Object.getOwnPropertyNames 返回一個數組，包含對象自身的所有屬性 (4) Object.getOwnPropetrySymbols(obj) Object.getOwnPropetrySymbols 返回一個數組，包含對象自身的所有 Symbol屬性的鍵名。 (5) Reflect.ownKeys(Obj) Reflect.ownKeys 返回一個數組，包含對象自身的所有鍵名。 8._proto_ 屬性。 _proto_ 屬性，用來讀取和設置當前對象的protoype對象。 const obj = { method: function(){ console.log(111) } } obj._proto_= someOtherrObj; Object.setPrototypeOf() Object.setPrototypeOf 方法的作用與 _proto_ 相同，用來設置一個對象的prototype對象 返回參數對象本身，。 // 格式 Object.setPrototypeOf(object,prototype) // 用法 const o = Object.setPrototypeOf({},null); Object.getPrototypeOf() 該方法與Object.setPrototypeOf 方法配套，用於讀取一個對象的原型對象。 Object.getPrototypeOf(obj); 9.super 關鍵字 this 關鍵字總是指向函數所在的當前對象，super 指向當前對象的原型對象。 const proto = { foo: 'hello' }; const obj = { find(){ return super.foo; } } Object.setPrototypeOf(obj,proto); obj.find(); 10.Object.keys() ,Object.values(),Object.entries() let {keys,values,entries} = Object; let object = {a:1,b:2,c:3}; for (let key of keys(obj)){ console.log(key); // 'a','b','c' } for(let key of keys(obj)){ console.log(key);// 'a','b','c' } for(let value of values(obj)){ console.log(key); // 1,2,3 } for (let [key,value] of entries(obj)){ console.log([key,value]); // ['a',1],['b',2],['c',3] } 11.對象的擴展運算 對象的結構賦值用於從一個對象取值，相當於將所有可遍歷的，但尚未對齊的屬性， 分配到指定的對象上面，所有的鍵和值他們的值，都會拷貝到新對象上面。 let {x,y,...z} = {x:1,y:2,a:3,b:4}; x // 1 y // 2 z // {a:3,b:4} 擴展運算 擴展運算符(...) 用於取出參數對象的多有可遍歷屬性，拷貝到當前對象之中。 let z = {a:3,b:4}; let n = {...z}; n // {a:3,b:4} 合併兩個對象 let ab = {...a,...b}; // 等同於 let ab = Object.assign({},a,b)