js 增强对象语法 (属性值简写/可计算属性)

107 阅读1分钟
1.属性值简写
    let name = 'Matt'; 
    let person = { name: name }; 
    console.log(person); // { name: 'Matt' }
    let name = 'Matt'; 
    let person = { name }; 
    console.log(person); // { name: 'Matt' }

二者相同

2.可计算属性
    const nameKey = 'name'; 
    const ageKey = 'age';
    const jobKey = 'job'; 
    let person = {}; 
    person[nameKey] = 'Matt'; 
    person[ageKey] = 27; 
    person[jobKey] = 'Software engineer'; 
    console.log(person); // { name: 'Matt', age: 27, job: 'Software engineer' }

在动态给予或者获取对象的属性值时用可计算属性就很好

3.简写方法名
    //旧的
    let person = { 
        sayName: function(name) { console.log(`My name is ${name}`); } 
    };
    person.sayName('Matt'); // My name is Matt

    //新的
    let person = { 
        sayName(name) { console.log(`My name is ${name}`); } 
    }; 
    person.sayName('Matt'); // My name is Matt