ES6对象扩展：简写、属性名表达式与super关键字解析

"这份文档包含了前端面试中关于JavaScript对象的最新扩展知识点，包括属性的简写、属性名表达式和super关键字的使用。" 在JavaScript的ES6版本中，对象新增了一些重要的扩展特性，这对于前端开发者来说是必须要掌握的知识点。 一、属性的简写 在ES6中，如果对象的键名与对应的值相同，我们可以使用简写的方式来创建对象。例如： ```javascript const baz = { foo: foo }; // 等同于 const baz = { foo }; ``` 同样，对于方法，也可以使用简写形式： ```javascript const o = { method() { return "Hello!"; } }; // 等同于 const o = { method: function() { return "Hello!"; } }; ``` 这种简写在函数内部作为返回值时特别有用，例如： ```javascript function getPoint() { const x = 1; const y = 10; return { x, y }; } getPoint(); // { x: 1, y: 10 } ``` 但是需要注意，使用简写形式的对象方法不能用作构造函数，因为`this`的指向会在实例化过程中出错： ```javascript const obj = { f() { this.foo = 'bar'; } }; new obj.f(); // 报错 ``` 二、属性名表达式 在ES6中，我们可以在创建对象时使用表达式作为属性名，这使得动态生成属性名成为可能： ```javascript let lastWord = 'lastword'; const a = { 'firstword': 'hello', [lastWord]: 'world' }; a['firstword']; // "hello" a[lastWord]; // "world" a['lastword']; // "world" ``` 此外，表达式还可以用来定义方法名： ```javascript let obj = { ['h' + 'ello']() { return 'hi'; } }; obj.hello(); // hi ``` 但需要注意的是，属性名表达式与简洁表示法不能同时使用，这会导致语法错误： ```javascript // 报错 const foo = 'bar'; const baz = {[foo]}; // 正确 const baz = {[foo]: 'abc'}; ``` 如果属性名表达式是一个对象，它会被自动转换为字符串`[object Object]`： ```javascript const keyA = {a: 1}; const keyB = {b: 2}; const myObject = { [keyA]: 'valueA', [keyB]: 'valueB' }; myObject // Object{[object Object]:"valueB"} ``` 三、`super`关键字 `super`关键字在ES6中被引入，它指向当前对象的原型对象。这在继承和构造函数中非常有用： ```javascript const proto = { foo: 'hello' }; class SubClass extends BaseClass { constructor() { super(); console.log(super.foo); // "hello" } } ``` `super`不仅可以用于访问原型对象的属性，还可以调用原型对象的方法。然而，在子类的构造函数中，`super`必须在`this`关键字使用之前调用，因为`this`在`super`之后才会被绑定到子类实例。 这些是JavaScript对象在ES6中的一些重要扩展，对于准备前端大厂面试的开发者来说，理解和熟练运用这些特性是至关重要的。