如何将Map返回的对象数组合并为单个聚合对象？

你的代码逻辑本身没问题，但map方法会返回一个对象数组，每个元素都是只包含一个键的对象。要得到你期望的单个合并对象，只需要把map换成reduce就行，或者把map的结果合并到一个对象里。

解决方法：用reduce替代map #

reduce可以帮我们把数组里的每个对象合并到一个累加器对象中，最终得到单个完整对象。修改后的代码如下：

console.clear();
const filterList = {
  ageRange: ["ageRange", "picAgeRange"],
  goal: ["goal", "motivation"],
  hairColor: ["hairColor", "picHairColor"]
};

const questionList = [{
    question: "ageRange",
    lastUpdated: "2018-07-09T18:13:42.541",
    info: null,
    type: "SELECT",
    answers: [{
        value: "18-30",
        selected: true
      },
      {
        value: "31-35",
        selected: false
      },
      {
        value: "36-45",
        selected: false
      },
      {
        value: "46-55",
        selected: false
      },
      {
        value: "55+",
        selected: false
      }
    ]
  },
  {
    question: "picAgeRange",
    lastUpdated: "2018-07-09T18:13:42.541",
    info: null,
    type: "SELECT",
    answers: [{
        value: "country 6",
        selected: true
      },
      {
        value: "smart casual 4",
        selected: false
      },
      {
        value: "dark denim 6",
        selected: false
      },
      {
        value: "sporty 6",
        selected: false
      },
      {
        value: "adventure 5",
        selected: false
      },
      {
        value: "prints 5",
        selected: false
      },
      {
        value: "excentric 5",
        selected: false
      },
      {
        value: "dont like any private style",
        selected: false
      }
    ]
  },
  {
    question: "goal",
    lastUpdated: "2018-07-09T18:13:42.541",
    info: null,
    type: "SELECT",
    answers: [{
        value: "save time",
        selected: true
      },
      {
        value: "personal advice",
        selected: false
      },
      {
        value: "inspiration",
        selected: false
      },
      {
        value: "testing the service",
        selected: false
      }
    ]
  },
  {
    question: "hairColor",
    lastUpdated: "2018-07-09T18:13:49.567",
    info: null,
    type: "SELECT",
    answers: [{
        value: "blond",
        selected: true
      },
      {
        value: "brown",
        selected: false
      },
      {
        value: "black",
        selected: false
      },
      {
        value: "red",
        selected: false
      },
      {
        value: "grey",
        selected: false
      },
      {
        value: "noHair",
        selected: false
      }
    ]
  },
  {
    question: "picHairColor",
    lastUpdated: "2018-07-09T18:13:42.541",
    info: null,
    type: "SELECT",
    answers: [{
        value: "suit 3",
        selected: true
      },
      {
        value: "business casual",
        selected: false
      },
      {
        value: "casual",
        selected: false
      },
      {
        value: "have to wear uniform",
        selected: false
      },
      {
        value: "classic",
        selected: false
      },
      {
        value: "conservative",
        selected: false
      },
      {
        value: "relaxed 2",
        selected: false
      },
      {
        value: "dont like any work style",
        selected: false
      }
    ]
  }
];

// 用reduce替代map，合并成单个对象
const ofQuestionsList = Object.entries(filterList).reduce(
  (acc, [questionKey, questionNames]) => {
    acc[questionKey] = questionList.filter((item) =>
      questionNames.includes(item.question)
    );
    return acc;
  },
  {} // 初始累加器是一个空对象
);
console.log(ofQuestionsList);

为什么这样能行？ #

• map的作用是把数组的每个元素转换成新元素，所以会返回一个和原数组长度相同的新数组，这里就得到了3个单键对象组成的数组。
• reduce则是从一个初始值（这里是空对象{}）开始，把数组的每个元素处理后合并到初始值里，最终得到一个完整的合并对象，正好符合你的期望。

运行结果 #

执行修改后的代码，控制台会输出你期望的结构：

{
  "ageRange":[
    {
      "question":"ageRange",
      "lastUpdated":"2018-07-09T18:13:42.541",
      "info":null,
      "type":"SELECT",
      "answers": [...]
    },
    {
      "question":"picAgeRange",
      "lastUpdated":"2018-07-09T18:13:42.541",
      "info":null,
      "type":"SELECT",
      "answers": [...]
    }
  ],
  "goal":[
    {
      "question":"goal",
      "lastUpdated":"2018-07-09T18:13:42.541",
      "info":null,
      "type":"SELECT",
      "answers": [...]
    }
  ],
  "hairColor":[
    {
      "question":"hairColor",
      "lastUpdated":"2018-07-09T18:13:49.567",
      "info":null,
      "type":"SELECT",
      "answers": [...]
    },
    {
      "question":"picHairColor",
      "lastUpdated":"2018-07-09T18:13:42.541",
      "info":null,
      "type":"SELECT",
      "answers": [...]
    }
  ]
}

内容的提问来源于stack exchange，提问作者Mo.