为什么 reducer 会忽略数组中的第一项？答案

【问题标题】：Why reducer ignores first item in the array?为什么 reducer 会忽略数组中的第一项？
【发布时间】：2019-08-05 19:26:23
【问题描述】：

我有这个函数应该运行每个验证器，然后返回包含错误的对象。

似乎一切正常，但数组中的第一个验证器。似乎reduce 完全忽略了它。无论我放什么验证器，它都会直接转到第二个。

我在这里遗漏了什么明显的东西吗？

export default values => (
  [
    validateFullName,
    validateServicePresence,
    validatePhoneField,
    validateOrganizationName,
    validateInn,
    validateEmailField,
    validateManagerEmail,
    validateComment,
    validateAgreement,
  ].reduce((currentErrors, validator) => {
    const validationResult = validator(values);

    return {
      ...currentErrors,
      ...validationResult,
    };
  })
);

【问题讨论】：

只需添加一个初始值，例如.reduce((currentErrors, validator) => { const validationResult = validator(values); return { ...currentErrors, ...validationResult, }; }, {})
reduce 将第一个元素作为默认（初始）累加器，除非您指定应该是什么累加器。

标签： javascript arrays reduce

【解决方案1】：

如果您不提供要归约的初始值，那么它将使用数组的第一个元素作为初始值，并跳过使用该元素调用您的归约器。所以第一次调用减速器时，currentErrors 是 validateFullName，validator 是 validateServicePresence。

要解决这个问题，只需添加一个初始值：

export default values => (
  [
    validateFullName,
    validateServicePresence,
    validatePhoneField,
    validateOrganizationName,
    validateInn,
    validateEmailField,
    validateManagerEmail,
    validateComment,
    validateAgreement,
  ].reduce((currentErrors, validator) => {
    const validationResult = validator(values);

    return {
      ...currentErrors,
      ...validationResult,
    };
  }, {}) // <===================
);

在此处查看 initialValue 部分：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce#Parameters

【讨论】：

【解决方案2】：

如果没有提供起始值，默认情况下Array.prototype.reduce 使用第一个元素作为累加器值。显式传递累加器的 statring 值将确保您的第一个元素也被处理。

See the initialValue parameter on the MDN docs

export default values => (
  [
    validateFullName,
    validateServicePresence,
    validatePhoneField,
    validateOrganizationName,
    validateInn,
    validateEmailField,
    validateManagerEmail,
    validateComment,
    validateAgreement,
  ].reduce((currentErrors, validator) => {
    const validationResult = validator(values);

    return {
      ...currentErrors,
      ...validationResult,
    };
  }, {})
);

【讨论】：