ES6物件的擴充套件及新增方法
1.屬性的簡潔表示法
ES6允許直接寫入變數和函式，作為物件的屬性和方法。這樣的書寫更加簡潔。
const foo = 'bar';
const baz = {foo};
baz//{foo:'bar'}
//等同於
const baz = {foo:foo}
上面程式碼表明，ES6允許在物件之中，直接寫變數。這時，屬性名為變數名，屬性值為變數的值。下面是另一個例子。
function f(x,y){
return {x,y}
}
//等同於
function f(x,y){
return {x:x,y:y};
}
f(1,2)//{x:1,y:2}
除了屬性簡寫，方法也可以簡寫。
const o ={
method(){
return 'Hello!'
}
}
//等同於
const o = {
method:function(){
return 'Hellow';
}
}
下面是一個實際的例子。
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}
}
getPoint()//{x:1,y:10}
CommonJS模組輸出一組變數，就非常合適使用簡潔寫法。
let ms = {}; function getItem(key){ return key in ms ?ms[key]:null; } function setItem(key,value){ ms[key] = value; } function clear(){ ms={} } module.exports = {getItem,setItem,clear}; //等同於 module.exports = { getItem:getItem, setItem:setItem, clearLclear }
屬性的賦值器(setter)和取值器(getter),事實上也是採用這種寫法。
const cart = {
_wheels:4,
get wheels(){
return this._wheels;
},
set wheels (value){
if(value<this._wheels){
throw new Error('數值太小了！');
}
this._whells = value;
}
}
2.屬性名錶達式
JavaScript定義物件的屬性，有兩種方法。
//方法一
obj.foo = true;
//方法二
obj['a'+'bc'] = 123;
上面程式碼的方法一是直接用識別符號作為屬性名，方法二是用表示式作為屬性名，這時將表示式放在方括號之內。
但是，如果使用字面量定義物件(使用大括號)，在ES5中只能使用方法一(識別符號)定義屬性。
var obj ={
foo:true,
abc:123
}
ES6允許字面量定義物件時，用方法二作為物件的屬性名，即把表示式放在括號內。
let propKey = 'foo';
let obj ={
[propKey]:true,
['a'+'bc']:123
}
下面是另一個例子：
let lastWord = 'last word';
const a = {
'first word':'hello',
[lastWord]:'world'
};
a['first word']//hello
a[lastWord]//world
a['last word']//world
表示式還可以用於定義方法名。
let obj = {
['h'+'ello'](){
return 'hi'
}
}
obj.hello()//hi;
注意：
屬性名錶達式與簡潔表示法，不能同時使用，會報錯。
屬性名錶達式如果是一個物件，預設情況下會自動將物件轉為字串[object object],這一點要特別小心。
const keyA = {a:1};
const keyB = {b:2};
const myObject = {
[keyA]:'valueA',
[keyB]:'valueB'
};
myObject;// Object {[object Object]: "valueB"}
上面程式碼中,[keyA]和[keyB]得到的都是[object object],所以[keyB]會把[keyA]覆蓋掉，而myObject最後只有一個[object object]屬性。
方法的name屬性
函式的name屬性，返回函式名。物件方法也是函式，因此也有name屬性。
const person = {
sayName() {
console.log('hello!');
},
};
person.sayName.name // "sayName"
屬性的可列舉型和遍歷
物件的每個屬性都有一個描述物件，用來控制改屬性的行為。Object.getOwnPropertyDescriptor(obj,'foo')方法可以獲取該屬性的描述物件。
描述物件的enumerable屬性，稱為可列舉性，如果該屬性為false，就表示某些操作會忽略當前的屬性。
目前，有四個操作會忽略enumerable為false的屬性。
for...in迴圈：只遍歷物件自身的和繼承的可列舉的屬性。(不包含Symbol屬性)
Object.keys():返回物件自身的所有可列舉的屬性的鍵名,返回一個數組。(不包含Symbol)
JSON.stringify():只序列化物件自身的可列舉的屬性。
object.assign():忽略enumrable為false的屬性，只拷貝物件自身的可列舉的屬性。
ES6一共有5種方法可以遍歷物件的屬性。
（1）for...in
for...in迴圈遍歷物件自身的和繼承的可列舉屬性(不包含Symbol屬性)。
（2）Object.keys(obj)
object.keys返回一個數組，包含物件自身的（不含繼承的）所有可列舉屬性（不包含Symbol屬性）的鍵名。
（3）Object.getOwnPropertyNames(obj)
返回一個數組，包含物件自身的所有屬性(不含Symbol屬性，但是包括不可列舉屬性)的鍵名。
（4）Object.getOwnPropertySymbols(obj)
返回一個數組，包含物件自身的所有Symbol屬性的鍵名。
（5）Reflect.ownKeys(obj)
Reflect.ownKeys返回一個數組，包含物件自身的所有鍵名，不管鍵名是Symbol或字串，也不管是否可列舉。
super關鍵字
我們知道，this關鍵字總是指向函式所在的當前物件，ES6又新增了另一個類似的關鍵字super，指向當前物件的原型物件。
const proto = {
foo:'hello'
};
const obj = {
foo:'world',
find(){
return super.foo;
}
};
Object.setPrototypeOf(obj,proto);
obj.find();//hello
上面程式碼中，物件obj.find()方法之中，通過super.foo引用了原型物件proto的foo屬性。
注意：super關鍵字表示原型物件時，只能用在物件的方法之中，用在其他地方都會報錯。目前，只有物件方法的簡寫法可以讓Javascript引擎確認，定義的是物件的方法。
JavaScript引擎內部，super.foo等同於Object.getPrototypeOf(this).foo或Object.getPrototypeOf(this).foo.call(this)。
物件的擴充套件運算子
解構賦值
物件的解構賦值用於從一個物件取值，相當於將目標物件自身的所有可遍歷、但尚未被讀取的屬性，分配到指定的物件上面。所有的鍵和它們的值，都會拷貝到新物件上面。ES6 Promise物件
let{x,y,...z} = {x:1,y:2,a:3,b；4};
x//1,
y//2,
z//{a:3,b:4}
上面程式碼中，變數z是解構賦值所在的物件。它獲取等號右邊的所有尚未讀取的鍵（a和b）,將它們連同值一起拷貝過來。