Typescript/Javascript：将对象数组转换为键值对答案

【问题标题】：Typescript/Javascript: convert array of objects to key,value pairTypescript/Javascript：将对象数组转换为键值对
【发布时间】：2019-04-08 13:43:51
【问题描述】：

在我的应用程序（React-typescript）中，我有一些类型为

的文档

interface IDocument {id: string;  questions: IQuestion[];}

interface IQuestion {number: string;  answer: string; }

所以文档数组看起来像：

doscuments: IDocument[] = [
  {id: "a",
    questions: [
      { number: "1", answer: "answer1" },
        ... /* more number answer*/
    ]},
  {id: "b",
    questions: [
      { number: "1", answer: "answer1" },
        ... /* more number answer*/
    ]}
];

现在我想把它转换成另一种类型的形式

interface IAlternative {
  [key: string]: string;
}

具有键值对，即

alterDocs: IAlternative = {a1:"answer1", a2:"answer2",...,b1:"answer1",...}

为此，我有下面的代码，但无法构造以doc.id+question.number 作为键和question.answer 作为值的对

documents.forEach(doc:IDocument=>{
 doc.questions.forEach(question=>{
    const pair= {} // I cannot construct this pair
    alterDocs={...alterDocs,...pair}
  })
})

【问题讨论】：

标签： javascript typescript foreach key-pair

【解决方案1】：

您可以使用reduce

这里的想法是

循环通过arr，从元素中获取id和questions
questions 上没有循环按所需格式添加键和值

let arr = [
  {id: "a",
    questions: [
      { number: "1", answer: "answer1" },
        { number: "2", answer: "answer2" }
    ]},
  {id: "b",
    questions: [
      { number: "1", answer: "answer1" },
      { number: "2", answer: "answer2" }
    ]}
];

let op = arr.reduce((op,inp)=>{
  let key = inp.id
  let value = inp.questions
  value.forEach(e=>{
    op[`${key}${e.number}`] = op[`key${e.number}`] || {}
    op[`${key}${e.number}`] = e.answer
  })
  return op
},{})

console.log(op)

【讨论】：

感谢您的回答，这几乎就是我要搜索的内容，但对我来说，结果是一个数组，而不是一个对象。即在 chrome 控制台中，我看到 alterDocs: Array(0) 但是当展开它时，我看到了内容

【解决方案2】：

你可以使用reduce函数来得到你想要的数据结构。

const alterDocs = documents.reduce((total, doc: IDocument): IAlternative[] => {

  // loop through the questions and create an array of IAlternative objects
  const subDocs = doc.questions.reduce((aggregator, question: IQuestion): IAlternative[] => {

    // push the next question onto the IAlternative object
    aggregator.push({
      `${doc.id}${question.number}`: question.answer,
    });

    // return the IAlternative array
    return aggregator
  }, []);

  //  You will have an array of IAlternative documents.  Append this onto 
  //  the parent IAlternative array with concat
  total.concat(subDocs);
  return total;
}, []);

【讨论】：

谢谢，但我不希望最终结果是一个数组。就像他质疑一个对象一样

【解决方案3】：

我发现它比我想象的要简单得多:) 感谢答案，但不需要复杂的减速器

   alterDocs: IAlternative = {}

    documents.forEach(doc=>{
    const id=doc.id;
    doc.questions.forEach(q=>{
        const num=q.number;
        const ans=q.answer;
        alterDocs[`${id}${num}`]=ans;
      })
    })

let documents = [
  {id: "A", questions: [
      { number: "1", answer: "answerA1" },
      { number: "2", answer: "answerA2" },
      { number: "3", answer: "answerA3" }
    ]
  },
  {id: "B", questions: [
      { number: "1", answer: "answerB1" },
      { number: "2", answer: "answerB2" },
      { number: "3", answer: "answerB3" }

    ]
  },
  {id: "C", questions: [
      { number: "1", answer: "answerC1" },
      { number: "2", answer: "answerC2" },
      { number: "3", answer: "answerC3" }

    ]
  }
];

let altDocs = {};

documents.forEach(doc => {
   const id = doc.id;
      doc.questions.forEach(q => {
        const num = q.number;
        altDocs[`${id}${num}`] = q.answer;
      });
    });
    
    console.log(altDocs);

【讨论】：