1. 屬性的簡潔表示法
在ES6中 允許直接寫入變量和函數，作爲對象的屬性和方法，使得代碼的書寫更爲簡潔。
const f = 'a'
const b = {f}
b // {f: 'a'}
等同於
const b = {f: f}
在ES6中允許在對象內直接寫變量，這時候屬性名爲變量名，屬性值就是變量值
function u(x, y){
return {x, y}
}
// ====
function u(x, y){
return {x: x, y: y }
}
u(1, 2) // {x:1, y: 2}
或者一下寫法：
function o() {
const x = 1;
const x = 2;
return {x, y}
}
o() // {x:1, y:2}
2. 屬性名表達式
在JavaScript中屬性名的表達式的方法有兩種，一種 直接用標識符作爲屬性名，第二種用表達式作爲屬性名。第二種寫的時候表達式要放在方括號之內
//一
obj.foo = true
//二
obj['a' + 'bc'] = 123
//三
let t = 'm'
let obj = {
[t]: true,
['a' + 'bc']: 123
}
表達式還可以用來定義方法名(注意：屬性名表達式不能和簡潔表示法同時使用)
let obj = {
['h' + 'ello']() {
return 'hi'
}
}
obj.hello() // hi
如果屬性名表達式是一個對象，則默認情況下會自動將對象轉爲字符串[object Object]
const ka = {a: 1}
const kb = {b: 2}
const myObj = {
[ka]: 'va',
[kb]: 'vc'
}
myObj // Object {[object Object]: 'vc'}
3. 方法的 name 屬性
函數的name 屬性，返回函數名，對象方法也是函數，因此也由name 屬性
const p = {
n() {
console.log('h')
}
}
p.n.name // n
特殊情況 getter 和 setter 屬性是在 get 和 set上面
const obj = {
get foo() {},
set fod() {}
}
obj.foo.name // undefined
const d = Object.getOwnPropertyDescriptor(obj, 'foo')
d.get.name // get foo
d.set.name // set fod
特殊情況 bind創造的函數 name 屬性返回 bound 加上原有函數的名字
var do = function(){
}
do.bind().name // bound do
特殊情況 Function構造函數創造的函數，name 返回 anonymous
(new Function()).name // anonymous
如果對象的方法是一個Symbol 那麼name 返回這個 Symbol的描述
const k = Symbol('描述')
k.name // "[描述]"
4. 屬性的可枚舉性和遍歷
可枚舉性
對象的每個屬性都有一個描述對象，用來控制該屬性的行爲，Object.getOwnPropertyDescriptor 方法可以獲取該屬性的描述對象
let obj = {f: 234}
Object.getOwnPropertyDescriptor(obj, 'foo')
// {
// value: 234,
// writable: true,
// enumerable: true,
// configurable: true
// }
描述對象的 enumerable 屬性，稱爲 “可枚舉性”，如果該屬性爲true就表示某些操作會忽略當前操作
有四個操作會忽略 enumerate 爲 false 的屬性
- for...in循環： 只遍歷對象自身和繼承的可枚舉的屬性
- Object.keys()：返回對象自身的所有可枚舉的屬性的鍵名
- JSON.stringify(): 只串行化對象自身的可枚舉的屬性
- Object.assign(): 忽略enumerable爲false的屬性，只
拷貝對象自身的可枚舉的屬性
ES6中 所有class 的原型的方法都是不可枚舉的
屬性的遍歷
ES6一共有5種方法可以遍歷對象的屬性。
（1）for...in
for...in循環遍歷對象自身的和繼承的可枚舉屬性（不含 Symbol 屬性）。
（2）Object.keys(obj)
Object.keys返回一個數組，包括對象自身的（不含繼承的）所有可枚舉屬性（不含 Symbol 屬性）的鍵名。
（3）Object.getOwnPropertyNames(obj)
Object.getOwnPropertyNames返回一個數組，包含對象自身的所有屬性（不含 Symbol 屬性，但是包括不可枚舉屬性）的鍵名。
（4）Object.getOwnPropertySymbols(obj)
Object.getOwnPropertySymbols返回一個數組，包含對象自身的所有 Symbol 屬性的鍵名。
（5）Reflect.ownKeys(obj)
Reflect.ownKeys返回一個數組，包含對象自身的所有鍵名，不管鍵名是 Symbol 或字符串，也不管是否可枚舉。 1）for..in
以上五種方法遍歷對象的鍵名，都遵循同樣的屬性遍歷的次序股則
首先遍歷所有數值鍵，按照數值升序排列。
其次遍歷所有字符串鍵，按照加入時間升序排列。
最後遍歷所有 Symbol 鍵，按照加入時間升序排列。
5. super關鍵字
this的關鍵字總是指向函數所在的當前對象，ES6 又新增了另一個類似的關鍵字 super，指向當前對象的原型對象
注意：super關鍵字表示原型對象時，只能用在對象的方法之中，用在其他他地方都會報錯。
// 報錯
const obj = {
foo: super.foo
}
// 報錯
const obj = {
foo: () => super.foo
}
// 報錯
const obj = {
foo: function () {
return super.foo
}
}
上面三種super的用法都會報錯，因爲對於 JavaScript 引擎來說，這裏的super都沒有用在對象的方法之中。第一種寫法是super用在屬性裏面，第二種和第三種寫法是super用在一個函數裏面，然後賦值給foo屬性。目前，只有對象方法的簡寫法可以讓 JavaScript 引擎確認，定義的是對象的方法。
歡迎關注 公衆號【小夭同學】
ES6入門系列
Git教程