ES6學習筆記--屬性名表達式

1.直接用標識符作為屬性名：

obj.foo = true

2.用表達式作為屬性名：

obj['a'+'bc'] = 123

//相當於

obj['abc'] = 123

3.ES6 允許字面量定義對象時，用方法二（表達式）作為對象的屬性名，即把表達式放在方括號內。

let key = 'foo';
let obj = {
    [key]: true,
    ['a'+'bc']: 123
};

var lastWord = 'last word';

var a = {
  'first word': 'hello',
  [lastWord]: 'world'
};

a['first word'] // "hello"
a[lastWord] // "world"
a['last word'] // "world"

4.表達式用來定義方法名

let obj = {
    ['say' + 'Something']() {
        return 'hello word';
    }
};

obj.saySomething(); // hello word

5.注意，屬性名表達式與簡潔表示法，不能同時使用，會報錯。

// 會報錯
var foo = 'bar';
var bar = 'abc';
var baz = {[foo]};

//正確寫法：
var foo = 'bar';
var baz = {[foo]: 'abc'};

6.注意，屬性名表達式如果是一個對象，默認情況下會自動將對象轉為字符串[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]屬性。