ES6 の拡張オブジェクト リテラルの簡単な紹介

この記事では、ES6 の拡張オブジェクト リテラルについて簡単に紹介します。必要な方は参考にしていただければ幸いです。

概要

es6 では、オブジェクト リテラルの構文が強化されました

プロパティ宣言が短縮されました

プロパティのプロパティ名とプロパティ値が参照される場合、変数名は一貫性があり、直接省略可能

let name="jack"
// es6之前
var obj={name:name} // {name:"jack"}
// es6 
let obj={name}  // {name:"jack"}

短い関数宣言

属性の属性名が属性値の関数名 (関数) または属性値 ( function) には関数名がありません。省略できます。functionキーワードと属性名

// es6之前
var obj={sum: function(a, b){return a+b}}
// es6
let obj={sum(a, b){return a+b}} //{sum:function(a, b){return a+b}}

動的に計算される属性名

属性名は動的に変更できます

let key="name"
let obj={[key]:"jack"} // {name:'jack'}

概要

let key="name"
let age=23
let person={
    [key]:"jack",
    getName(){return "jack"},
    age
} // {name:"jack",getName:function(){return "jack"},age:23}

babelを使用して翻訳します

ソースコード

let key="name"
let age=23
let person={
    [key]:"jack",
    getName(){return "jack"},
    age
}

翻訳後、 Object.defineProperty##を使用して実装されていることがわかります。 #rree

以上がES6 の拡張オブジェクト リテラルの簡単な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。