ECMAScript6: 对象字面量语法扩展
来自CloudWiki
在ES6中,对象字面量变得更加强大。
属性初始值的简写
/*function createCar(color, doors){ return { color : color, doors : doors } }*/ /*let name = "zhangsan"; let age = 18; var person = {name: name, age : age}; console.log(person);*/
在ES6中,可以简化这种属性名称与本地变量之间的重复书写:
function createCar(color, doors){ return { // 有同名的参数,只写属性名即可 color, doors } } let car = createCar("red", 4); console.log(car); let name = "zhangsan"; let age = 18; // 有同名的本地变量,只写属性名即可 var person = {name, age}; console.log(person);
对象方法的简写语法
/* var car = { color: "red", doors: 4, showColor: function(){ console.log(this.color); } } */
在ES6中定义对象方法时可以省略冒号和function关键字。
var car = { color: "red", doors: 4, showColor(){ console.log(this.color); } } car.showColor(); console.log(car.showColor.name);
可计算的属性名
在ES6中,可以在对象字面量中使用可计算的属性名称:
/*let suffix = "name"; let person = {}; person["first name"] = "san"; // 属性名中有空格 person["last " + suffix] = "zhang"; // 属性名由表达式计算得到 person.age = 20; // 常规的属性可以直接通过点号访问 console.log(person); // { 'first name': 'san', 'last name': 'zhang', age: 20 } */ let suffix = "name"; let person = { ["first " + suffix] : "san", ["last " + suffix]: "zhang", age: 20 } console.log(person); // { 'first name': 'san', 'last name': 'zhang', age: 20 }