By ldesigns


2019-03-14 19:57:18 8 Comments

EDIT: Thanks for the replies!

I am kind of new to working with Javascript (sorry for probably the bad code). I've mainly only worked with HTML and CSS. I have been trying to experiment with Javascript, but I've been stuck on this forever. The outcome is not what I want it to be.

My code:

I want to make the array easier to use, by putting the values under the same category, but my code's output is not exactly what I want it to be like.

var data = {
  idName: "idName",
  valueRanges: [{
    range: "range",
    majorDimension: "ROWS",
    values: [
      [
        "ID",
        "Category",
        "Name"
      ],
      [
        "1",
        "Category1",
        "Name1"
      ],
      [
        "2",
        "Category1",
        "Name2"
      ],
      [
        "3",
        "Category2",
        "Name3"
      ],
      [
        "4",
        "Category1",
        "Name4"
      ]
    ]
  }]
}

var rows = [];

let batchRowValues = data.valueRanges[0].values
for (let i = 1; i < batchRowValues.length; i++) {
  let rowObject = {};
  for (let j = 0; j < batchRowValues[i].length; j++) {
    rowObject[batchRowValues[0][j]] = batchRowValues[i][j];
  }
  rows.push(rowObject);
}

var newArray = rows.reduce(function(acc, curr) {
  var findIfNameExist = acc.findIndex(function(item) {
    return item.Category === curr.Category;
  })
  if (findIfNameExist === -1) {
    let obj = {
      'Category': curr.Category,
      'value': [curr]
    }
    acc.push(obj)
  } else {
    acc[findIfNameExist].value.push(curr)
  }
  return acc;
}, []);

console.log('------------')
console.log('input: ' + JSON.stringify(data, null, 2))
console.log('------------')
console.log('output: ' + JSON.stringify(newArray, null, 2))

My code's output:

[
  {
    Category: "Category1",
    value: [
      {
        Category: "Category1",
        ID: "1",
        Name: "Name1"
      }, 
      {
        Category: "Category1",
        ID: "2",
        Name: "Name2"
      },
      {
        Category: "Category1",
        ID: "4",
        Name: "Name4"
      }
    ]
  },
  {
    Category: "Category2",
    value: [
      {
        Category: "Category2",
        ID: "3",
        Name: "Name3"
      }
    ]
  }
]

How I want it to look:

[
  {
    Category: "Category1",
    values: [
      {
        ID: "1",
        Name: "Name1"
      },
      {
        ID: "2",
        Name: "Name2"
      },
      {
        ID: "4",
        Name: "Name4"
      }
    ]
  },
  {
    Category: "Category2",
    values: [
      {
        ID: "3",
        Name: "Name3"
      },
    ]
  },
]

I want to learn! I appreciate any help.

2 comments

@Kamil Kiełczewski 2019-03-14 20:09:06

Try (t={}, result in r)

data.valueRanges[0].values.slice(1).map( ([i,c,n])=> 
    (t[c]=t[c]||{Category:c,values:[]}, t[c].values.push({ID:i, Name:n})) );
let r= Object.values(t);

var data = 
  {
    idName: "idName",
    valueRanges: [
      {
        range: "range",
        majorDimension: "ROWS",
        values: [
          [
            "ID",
            "Category",
            "Name"
          ],
          [
            "1",
            "Category1",
            "Name1"
          ],
          [
            "2",
            "Category1",
            "Name2"
          ],
          [
            "3",
            "Category2",
            "Name3"
          ],
          [
            "4",
            "Category1",
            "Name4"
          ]
        ]
      }
    ]
  }
 
let t={};
data.valueRanges[0].values.slice(1).map( ([i,c,n])=> 
    (t[c]=t[c]||{Category:c,values:[]}, t[c].values.push({ID:i, Name:n})) );
let r= Object.values(t);

console.log(r);

@Kamil Kiełczewski 2019-03-14 20:34:34

I optimalize my code using some tricks from Code Maniac answer

@Code Maniac 2019-03-14 20:03:58

You can use reduce.

Here idea is

  • Create a object and use category as key
  • If a category is already found than push the desired object in it's value property. if not than we create a new one with suitable data.

I am using object here instead of array directly is because i can directly access element using key where as in array i need to loop through each time and check existence of value

var data = {idName: "idName",valueRanges: [{range: "range",majorDimension: "ROWS",values: [["ID","Category","Name"],["1","Category1","Name1"],["2","Category1","Name2"],["3","Category2","Name3"],["4","Category1","Name4"]]}]}

var rows = [];
let batchRowValues = data.valueRanges[0].values.slice(1,)

let op = batchRowValues.reduce((op,[ID,Category,Name]) => {
  if( op[Category] ){
    op[Category].value.push({ID,Name})
  } else {
    op[Category] = {
      Category,
      value: [{ID,Name}]
    }
  }
  return op
},{})

console.log(Object.values(op))

@Maheer Ali 2019-03-14 20:07:56

I think you wrote code based on the output My code's output But it should be according to How I want it to look

@Code Maniac 2019-03-14 20:11:15

@MaheerAli yes you're right i added category extra. fixed, thanks for pointing

Related Questions

Sponsored Content

86 Answered Questions

[SOLVED] How do JavaScript closures work?

3 Answered Questions

33 Answered Questions

[SOLVED] For-each over an array in JavaScript?

39 Answered Questions

[SOLVED] Loop through an array in JavaScript

26 Answered Questions

[SOLVED] What does "use strict" do in JavaScript, and what is the reasoning behind it?

79 Answered Questions

[SOLVED] How do I remove a particular element from an array in JavaScript?

  • 2011-04-23 22:17:18
  • Walker
  • 5720370 View
  • 7117 Score
  • 79 Answer
  • Tags:   javascript arrays

46 Answered Questions

54 Answered Questions

[SOLVED] How do I include a JavaScript file in another JavaScript file?

18 Answered Questions

[SOLVED] How do I empty an array in JavaScript?

  • 2009-08-05 09:08:39
  • akano1
  • 2216638 View
  • 2199 Score
  • 18 Answer
  • Tags:   javascript arrays

14 Answered Questions

[SOLVED] How to insert an item into an array at a specific index (JavaScript)?

Sponsored Content