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

Question

in my application (React-typescript) I have some documents in the type of

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

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

so an array of documents will look like ie:

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

now I want to convert it to an alternative form of type

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

to have key-value pairs of ie

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

For that I have the code below but cannot construct a pair with doc.id+question.number as key and question.answer as the value

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

Answer 1

You can use reduce

Here idea is

• Loop through arr , get id and questions from element
• No Loop on questions add key and value as per desired format

 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) 

Answer 2

You can use the reduce function to get the data structure you want.

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;
}, []);

Answer 3

I found out that it was much simpler than I thought :) Thanks to answers but there was no need for complicated reducers

   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);