Question

const errorMessage = "some error message";
const fieldName = "the field name";

const newFieldRules = [{
    custom: false,
    errorMessage: errorMessage,
    fieldName: fieldName,
    validatorName: `digits`
  },
  {
    custom: false,
    errorMessage: errorMessage,
    fieldName: fieldName,
    validatorName: `min`
  },
  {
    custom: false,
    errorMessage: errorMessage,
    fieldName: fieldName,
    validatorName: `max`
  }
];

我需要创建上面的数组。如您所见，所有对象的属性很少。

有什么方法可以改善这段代码，以避免重复吗？

Answer 1

使用Array.prototype.map消除重复：

const errorMessage = "some error message";
const fieldName = "the field name";

const newFieldRules = [`digits`, `min`, `max`].map(validatorName => ({
    custom: false,
    errorMessage,
    fieldName,
    validatorName
}));

console.log(newFieldRules);

Answer 2

可能是这样的：

const errorMessage = "some error message";
const fieldName = "the field name";

const defaultObj = {
    custom: false,
    errorMessage: errorMessage,
    fieldName: fieldName,
}


const newFieldRules = [
    {...defaultObj, validatorName: 'digits'},
    {...defaultObj, validatorName: 'min'},
    {...defaultObj, validatorName: 'max'},
]

console.log(newFieldRules)

Spread syntax被使用。

Answer 3

这是使用可重用mapper高阶函数的另一种方法，该函数采用映射结构，其键将与输出匹配，并且其值是要使用的值或生成这些值的函数。

映射器返回一个映射函数，该函数可以与数据一起调用以生成您的输出。这里使用一个简单的索引。

使用此模式，您只需定义一次mapper，就可以轻松生成复杂的输出，同时保持代码简洁。

const mapper = obj => val => Object.entries(obj).reduce((accum, [key, fnOrVal]) => {
  accum[key] = fnOrVal instanceof Function ? fnOrVal(val) : fnOrVal;
  return accum;
}, {});

const newFieldRulesGenerator = mapper({
    custom: false,
    errorMessage: 'some error message',
    fieldName: 'fieldName',
    validatorName: i => ['digits', 'min', 'max'][i]
});

const newFieldRules = [0, 1, 2].map(newFieldRulesGenerator);

console.log(newFieldRules);

如何简化创建除所有属性都相同以外的其他对象的数组？

3 个答案: