JavaScript 中的 ES6 對象文字屬性值簡寫

在 JavaScript 中，我們習慣於使用字面語法 {...} 來構造對象 ，其中每個鍵值對都被顯式定義。我們經常使用與我們用作值的現有變量相同的對象鍵名。

讓我們看下面的例子：

var name = 'John Doe';
var email = '[email protected]';
var age = 25;

var user = {
    name: name,
    email: email,
    age: age
};

正如您在上面看到的，屬性與變量具有相同的名稱。 對象文字屬性值速記 在 ES6 中引入以使對像初始化更短。

它允許我們通過簡單地傳遞變量來定義一個對象，其鍵與作為屬性傳入的變量具有相同的名稱：

let name = 'John Doe';
let email = '[email protected]';
let age = 25;

let user = { name, email, age };

console.log(user);

// { 
//     name: 'John Doe', 
//     email: '[email protected]', 
//     age: 25 
// }

屬性值簡寫語法自動將每個變量轉換為鍵值對，變量名作為屬性鍵，變量值作為屬性值。

您還可以在同一個對像中結合常規屬性和速記。當您想為屬性分配與變量名不同的鍵名時，這尤其有用：

let user = { name, userEmail: email, age };

// { 
//     name: 'John Doe', 
//     userEmail: '[email protected]', 
//     age: 25 
// }