Question 249166 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – create map for same keys and multiple values from api reponse

I am receving a response in javascript like below . I have given one example. There will be lots of different table_id coming with different values.

var a = [{
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '220.001',
    name: 'Gross Profit',
    code: 'LSGP'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Profit',
    code: 'LSTR'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Volume',
    code: 'OCVL'
  }
]
let result = []

a.map(y => {
  let index = result.findIndex(x => x.table_id === y.table_id)
  if (index === -1) {
    result.push({
      table_id: y.table_id,
      data: [y.name, y.code]
    })
  } else {
    result[index].data.push(y.kpi_name)
  }
})

console.log(result)

I am trying to create a json object like below . But its not working as required. Need some help

[
{
    "table_full_name":"Jin",
    "total" :"820.001",
    "data":[
        {
            "name":"Gross Profit",
            "code":"LSGP"
        },
        {
            "name":"Profit",
            "code":"LSTR"
        },
        {
            "name":"Volume",
            "code":"OCVL"
        }
    ]
}
]
Tags:

3

Answers


  1. 0

    Use Array::reduce() to collect your data and some object destructuring to split your items into parts:

    var a = [{
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '220.001',
    name: 'Gross Profit',
    code: 'LSGP'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Profit',
    code: 'LSTR'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Volume',
    code: 'OCVL'
  }
]
const result = a.reduce((r, {table_id, table_full_name, total, ...data}) => {
  
  const found = r.map.get(table_id);
  if(found){
    found.data.push(data);
    return r;
  }
  
  r.map.set(table_id, r.arr[r.arr.length] = {table_full_name, total, data: [data]});
  return r;
  
}, {arr: [], map: new Map}).arr;

console.log(result)
    Cycles: 1000000 / Chrome/117
--------------------------------------------------
Alexander   215/min  1.0x  237  222  229  215  230
Gabriele    346/min  1.6x  411  346  355  352  367
--------------------------------------------------
https://github.com/silentmantra/benchmark

    <script benchmark="1000000">
var a = [{
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '220.001',
    name: 'Gross Profit',
    code: 'LSGP'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Profit',
    code: 'LSTR'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Volume',
    code: 'OCVL'
  }
]

// @benchmark Gabriele

Object.values(a.reduce((all, y) => {
  const group = all[y.table_id] || {
    table_full_name: y.table_full_name,
    total: y.total,
    data: []
  };
  group.data.push({
    name: y.name,
    code: y.code
  })
  all[y.table_id] = group;
  return all;
}, {}));

// @benchmark Alexander
a.reduce((r, {table_id, table_full_name, total, ...data}) => {
  
  const found = r.map.get(table_id);
  if(found){
    found.data.push(data);
    return r;
  }
  
  r.map.set(table_id, r.arr[r.arr.length] = {table_full_name, total, data: [data]});
  return r;
  
}, {arr: [], map: new Map}).arr;

</script>
<script src="https://cdn.jsdelivr.net/gh/silentmantra/benchmark/loader.js"></script>
    Login or Signup to reply.
  2. 0

    You could use

    var a = [{
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '220.001',
    name: 'Gross Profit',
    code: 'LSGP'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Profit',
    code: 'LSTR'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Volume',
    code: 'OCVL'
  }
];

const result = Object.values(a.reduce((all, y) => {
  const group = all[y.table_id] || {
    table_full_name: y.table_full_name,
    total: y.total,
    data: []
  };
  group.data.push({
    name: y.name,
    code: y.code
  })
  all[y.table_id] = group;
  return all;
}, {}));

console.log(result)
    Login or Signup to reply.
  3. 0 
    const a = [{
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '220.001',
    name: 'Gross Profit',
    code: 'LSGP'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Profit',
    code: 'LSTR'
  },
  {
    table_id: 11111111,
    table_full_name: 'Jin',
    total: '820.001',
    paytable: '300',
    name: 'Volume',
    code: 'OCVL'
  }
]

const result = Object.values(a.reduce((map, {
  table_id,
  table_full_name,
  name,
  code,
  total
}) => {
  if (!(table_id in map)) {
    map[table_id] = {
      total,
      table_full_name,
      data: []
    }
  }
  
  map[table_id].data.push({ name, code })
  
  return map
}, {}))

console.log(result)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search