Справочник по синтаксису ES6: используйте распространение и логическое короткое замыкание для условного добавления полей к объекту во время объявления

Question

Я хочу построить объект следующим образом:

const obj = {
    a: 'a',  // only add this if "someCondition" is true
    b: 'b',  // only add this if "someCondition" is false
    always: 'present', // add this in any case
}

Это работает:

const obj = { always: 'present' }
if (someCondition) { obj.a = 'a' }
if (!someCondition) { obj.b = 'b' }

Однако я ищу более краткий способ с использованием синтаксиса ES6.

Answer 1

С помощью синтаксиса ES6 можно условно добавлять поля во время объявления объекта.

Это полезно, если потребитель объекта не допустит поля с нулевыми / неопределенными / какими-либо значениями, и вы нехотите написать несколько операторов, чтобы правильно объявить объект:

const obj = {
  ...(someCondition && {a: 'a'}),
  ...(!someCondition && {b: 'b'}),
  always: 'present'
}

Так как это работает?Давайте посмотрим на ...(true && {a: 'a'}).Оператор расширения ES6 "..." будет выполнять итерацию каждой пары field-> value в {"a": "a"}, применяя их к x.

true && xвыражение вернет x, тогда как false && x вернет false.Это известно как оценка короткого замыкания

Так что, если логическое выражение истинно, оператор расширения добавит поля, а если оно не верно, ничего не добавит.