从Java数组中返回具有默认值的对象

时间:2019-01-16 13:57:46

标签: javascript ecmascript-6

    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: ""}}

4 个答案:

答案 0 :(得分:2)

每当您希望将一组值减少为一个值时,您都在寻找.reduce()

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

答案 1 :(得分: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);

答案 2 :(得分:1)

您可以映射对象并将所有对象分配给单个对象。

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

console.log(object);

答案 3 :(得分:0)

modern browsersusing polyfills中,您可以使用Object.fromEntries()从数组创建对象,并使用数组的值作为键/属性,并用默认。

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

const result = Object.fromEntries(fields.map(value => [value, '']));

结果为{email: "", password: ""}