减少、展平和转换嵌套数组

Question

I am trying to find a solution to get a specific format for my nested JSON array. I have tried to use Lodash groupBy and Javascript reduce but I can not seem to find a solution.

Input format:

[
  { 
     lineitem: {
        id:1,
        price: { 
            amount:100
        },
        supplierName:TestSupplier1
     },
     quantity:10
  }, 
  {
     lineitem: {
        id:2,
        price: { 
            amount:200
        },
        supplierName:TestSupplier2
    },
    quantity:20
  },
  { 
     lineitem: {
        id:3,
        price: { 
            amount:300
        },
        supplierName:TestSupplier1
     },
     quantity:30
  }, 
  {
     lineitem: {
        id:4,
        price: { 
            amount:400
        },
        supplierName:TestSupplier4
    },
    quantity:40
  },
]

Desired output format:

[
  { 
     TestSupplier1: [
        {
           id:1,               
           amount:100,
           quantity:10
        },
        {
           id:3,
           amount:300,              
           quantity:30            
        }
     ],
     TestSupplier2: [
        {
           id:2,
           amount:200,               
           quantity:20    
        }
     ],
     TestSupplier4: [
        {
          id:4,              
          amount:400,
          quantity:40
        }
     ]
]

As I see it there are 3 steps here:

1. Group by supplierName
2. Flatten the price object
3. Move quantity into lineitem

Can anyone help solve this?

Update 1

After succesfully grouped by supplierName I now want to flatten the array further. Such that the TestSupplier'X' is placed within each array.

See example below:

[
    {
       supplierName:TestSupplier1,
       id:1,               
       amount:100,
       quantity:10
    },
    {   
       supplierName:TestSupplier1,
       id:3,
       amount:300,              
       quantity:30            
    },
    {
       supplierName:TestSupplier2,
       id:2,
       amount:200,               
       quantity:20    
    },
    {
       supplierName:TestSupplier4,
       id:4,              
       amount:400,
       quantity:40
    }
]

Answer 1

This should get you pretty much what you want, the only thing to note is that you can't have an object with multiple keys that are the same, so you have an array of objects rather than having an object with several keys of lineItem :

const result = data.reduce((result, item) => {
  // Get the supplier name, id, amount and quantity of the current item
  const supplierName = item.lineitem.supplierName;

  const {
    id,
    price: { amount }
  } = item.lineitem;
  const { quantity } = item;

  const lineItem = {
    id,
    amount,
    quantity
  };

  // If it already exists in the result, add the data to the existing key
  if (Object.keys(result).includes(supplierName)) {
    return Object.assign({}, result, {
      [supplierName]: [...result[supplierName], lineItem]
    });
  } else {
    // Otherwise create a new key
    return Object.assign({}, result, { [supplierName]: [lineItem] });
  }
}, {});

This gives you:

{ TestSupplier1:
   [ { id: 1, amount: 100, quantity: 10 },
     { id: 3, amount: 300, quantity: 30 } ],
  TestSupplier2: [ { id: 2, amount: 200, quantity: 20 } ],
  TestSupplier4: [ { id: 4, amount: 400, quantity: 40 } ] }

In the original question you asked for the whole thing to be wrapped in an array, which is obviously as simple as [result] .

Answer 2

let resObj = {};
data.forEach( el => {
    if(!Object.keys(resObj).includes(el.lineitem.supplierName))
    {
        console.log(el);
        resObj[el.lineitem.supplierName] = [];
        }
    let newInnerObj = { id: el.lineitem.id, amount: el.lineitem.price.amount, quantity: el.quantity };
    resObj[el.lineitem.supplierName].push(newInnerObj);
});

console.log(resObj);

Here is a simple answer, but like I said in my comment- you can't have object with properties of the same name, so the result is an object with TestSupplierX as properties, and each property si an array of object with the structure you requested.

It is really as simple as moving through all the original array and just construct the right object. What I think you missed is how to get them into the correct property name which comes from supplierName, and this is done just by checking if the result object already has it with Object.keys(obj).includes(key) , and if it doesn't- create it simply by accessing it and initializing it to an empty array.

Answer 3

If you're working in TypeScript, the following might help:

interface IInput {
  lineitem: {
    id: number;
    price: {
      amount: number;
    }
    supplierName: string;
  }
  quantity: number;
}

interface IOutputA {
  [key: string]: {
    id: number;
    amount: number;
    quantity: number;
  }[];
}

interface IOutputB {
  supplierName: string;
  id: number;
  amount: number;
  quantity: number;
}

function transformA(input: IInput[]): IOutputA {
  const ret: IOutputA = {};
  input.forEach(it => {
    ret[it.lineitem.supplierName] = [];
    ret[it.lineitem.supplierName].push({
      id: it.lineitem.id,
      amount: it.lineitem.price.amount,
      quantity: it.quantity,
    }
  }
  return ret;
}

function transformB(outputA: IOutputA): IOutputB {
  const ret: IOutputB = [];
  Object.keys(outputA).forEach(x => {
    outputA[x].forEach(y => {
      ret.push({
        supplierName: x,
        id: y.id,
        amount: y.amount,
        quantity: y.quantity,
      });
    });
  });
  return ret;
}

It would be nice to see your attempt at solving this as well.