web-dev-qa-db-ja.com

ES6 / ES7の「オプション」オブジェクトキーの簡潔で簡潔な構文

ES6/ES7には、Javascriptオブジェクトを定義するための多くの クールな機能 が既にあります。ただし、Javascriptでは次のパターンが一般的です。

const obj = { 
  requiredKey1: ..., 
  requiredKey2: ... 
};

if (someCondition) { 
  obj.optionalKey1 = ...;
}

オプションのキーと必須のキーの両方でオブジェクトを一度に定義する方法はありますか？

javascriptecmascript-6ecmascript-nextecmascript-7
28
Andrew Mao

object spread を使用して、オプションのプロパティを設定できます。

注：Object Rest/Spreadは、ECMAScriptのステージ4の提案です。 babel transform を使用する必要があるかもしれません。

let flag1 = true;
let flag2 = false;

const obj = { 
  requiredKey1: 1, 
  requiredKey2: 2,
  ...(flag1 && { optionalKey1: 5 }),
  ...(flag2 && { optionalKey2: 6, optionalKey3: 7 }),
  ...(flag1 && { optionalKey4: 8, optionalKey5: 9 })
};

console.log(obj);
57
Ori Drori

optionalキーを示すために、条件がfalseの場合、nullに割り当てることができます

const someCondition = true;

const obj = { 
  requiredKey1: 1, 
  requiredKey2: 2,
  optionalKey1: someCondition ? 'optional' : null
};

console.log(obj);
3
Suren Srapyan

次のパターンはJavascriptで一般的です

すべきではありません。形状の異なる多数のオブジェクトがあると、パフォーマンスが低下する可能性があります。レコードには常に同じキーが含まれている必要があります。だからただ使う

const obj = { 
  requiredKey1: …, 
  requiredKey2: …,
  optionalKey1: someCondition ? … : undefined,
};
0
Bergi