# 字面量增强

作者: 多叉树;转载须注明出处

ES6中的字面量增强是对对象字面量语法的改进,使得创建和操作对象变得更加简洁和灵活。主要包括以下几个方面:

# 1. 属性简写

当属性名和变量名相同时,可以只写一次。

const age = 18;
const person = {
  age // 等同于 age: age
};
console.log(person); // { age: 18 }

# 2. 方法简写

可以省略冒号和function关键字。

const person = {
  speak() { // 等同于 speak: function() {}
    console.log('Hello!');
  }
};
person.speak(); // 输出: Hello!

# 3. 计算属性名

可以在方括号[]内使用表达式作为属性名。

const keyName = 'dynamicKey';
const obj = {
  [keyName]: 'This is a dynamic key',
  ['computed' + 'Property']: 'Hello'
};
console.log(obj.dynamicKey); // 输出: This is a dynamic key
console.log(obj.computedProperty); // 输出: Hello

const func = () => 'age'
const person = {
	[func()]: 18,
	['n' + 'ame']: '小明'
}
console.log(person) // { age: 18, name: '小明' }

# 4. 方括号语法vs点语法

方括号语法更灵活,可以使用任何表达式作为属性名。点语法更简洁,但只能用于合法的标识符。

const obj = {};
const key = 'myKey';

obj.propertyName = 'Using dot notation';
obj[key] = 'Using bracket notation';
obj['property-with-dashes'] = 'Only possible with brackets';

console.log(obj.propertyName); // 输出: Using dot notation
console.log(obj[key]); // 输出: Using bracket notation
console.log(obj['property-with-dashes']); // 输出: Only possible with brackets

这些增强特性使得JavaScript中的对象操作更加直观和高效,特别是在处理动态属性名和创建更简洁的对象字面量时非常有用。