Возврат объекта со значениями по умолчанию из массива в Javascript

Question

    const fields = ['email', 'password'];

    const objFields = {};
    fields.forEach(value => {
      objFields[value] = '';
    });

    console.log(objFields);
// Outputs {email: "", password: ""}

Я хочу достичь того же результата, но без инициализации пустого объекта.

На самом деле я хочу установить начальное состояние компонента React.

class App extends Component {
  fields = ['email', 'password'];

  state = {

    fields: // the one liner code here that should return the object created from fields array,

  };
  ...

ожидаемый результат будет

// state = {fields: {email: "", password: ""}}

Answer 1

Всякий раз, когда вы хотите уменьшить массив значений до одного значения, вы ищете .reduce()

state = {
  fields: fields.reduce((acc, key) => ({...acc, [key]: ''}), {}),
};

Answer 2

Вам необходимо преобразовать массив, содержащий ключи, в реальный объект.

Для этого у вас есть много возможностей, но вам все равно нужно что-то делать, волшебного трюка нет.

Мое любимое решение - использовать функцию для вставки в ваш класс Utilitary. Так что его легко читать и использовать повторно.

---

номер 1: функция

function initializeKeys(keys, initialValue, object) {
  return keys.reduce((tmp, x) => {
    tmp[x] = initialValue;

    return tmp;
  }, object);
}

const objFields = initializeKeys(['email', 'password'], '', {
  otherKey: 'a',
});

console.log(objFields);

---

номер 2: forEach

const fields = ['email', 'password'];

const objFields = {};

fields.forEach(value => {
  objFields[value] = '';
});

console.log(objFields);

---

номер 3: сокращение

const fields = ['email', 'password'];

const objFields = {
  ...fields.reduce((tmp, x) => {
    tmp[x] = '';

    return tmp;
  }, {}),
};

console.log(objFields);

Answer 3

Вы можете отобразить объекты и назначить все одному объекту.

const
    fields = ['email', 'password'],
    object = Object.assign({}, ...fields.map(key => ({ [key]: '' })));

console.log(object);