Script JS transform array

Question

Hi guys I have a little question about a script and a way to get an output format like :

hierarchicalCategories.lvl0 : Womens  
hierarchicalCategories.lvl1 : Womens > Accessories  
hierarchicalCategories.lvl2 : Womens > Accessories > Bags  
hierarchicalCategories.lvl3 : Womens > Accessories > Bags > Sport- & Travel Bags

My array is simply : ["Womens", "Accessories", "Bags", "Sport- & Travel Bags"]
So I tried to code a function and get my expected data but, I'm blocked on how get my current postion and the first postitions of my array until the begining.

let categories = ["Womens", "Accessories", "Bags", "Sport- & Travel Bags"];
let rootName = "hierarchicalCategories.lvl";

const reindexFunction = () => {
  let current_position = 0;
  let size = categories.length;
  for (current_position; current_position < size; current_position++) {
    let first = rootName + current_position;
    if (current_position !== 0) {
      let categ =
        categories[current_position - 1] +
        " " +
        ">" +
        " " +
        categories[current_position];
      console.log(first+":"+categ);
    } else {
      let categ = categories[current_position];
      console.log(first+":"+categ);
    }
  }
};

reindexFunction();

The result of this is:

hierarchicalCategories.lvl0:Womens
hierarchicalCategories.lvl1:Womens > Accessories
hierarchicalCategories.lvl2:Accessories > Bags
hierarchicalCategories.lvl3:Bags > Sport- & Travel Bags

I'm sure it's easy but I searched some method to make this I found nothing. Thank you for your help, tips.

Muhammed B. Aydemir · Accepted Answer · 2021-10-22 11:33:01Z

2

Just iterate over the categories and get the categories from index 0 to the current index. I used the forEach, slice and join methods of arrays:

iterate over the categories with forEach
get the items from index 0 to the current index with slice
format the slice to the desired format with join

Note: console.log adds a space between each argument by default

let categories = ["Womens", "Accessories", "Bags", "Sport- & Travel Bags"];
let rootName = "hierarchicalCategories.lvl";

categories.forEach((c, i) => console.log(rootName+i, ':', categories.slice(0, i+1).join(' > ')))

edited Oct 22, 2021 at 11:33

answered Oct 22, 2021 at 11:23

Muhammed B. Aydemir

1,01510 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

CherryDT · Accepted Answer · 2021-10-22 11:24:15Z

The most straight-forward solution coming to me mind would be to map the indexes of the categories array to strings that are built from joining all elements of the array up to the index.

I'm doing this using Array.prototype.map and utilizing the second argument it passes to the callback function, which is the index. The first argument would be the value itself, but we are not interested in that, that's why I called it _ and it's not used.

I'm not sure about the exact output format desired - you said transform array, so I assume the result should be another array. But in case that's not the case, is should be easy to adjust.

const categories = ['Womens', 'Accessories', 'Bags', 'Sport- & Travel Bags']
const rootName = 'hierarchicalCategories.lvl'

function buildHierarchicalCategories (categories) {
  return categories.map((_, i) =>
    `${rootName}${i} : ${categories.slice(0, i + 1).join(' > ')}`
  )
}

console.log(buildHierarchicalCategories(categories))

Gabriel · Accepted Answer · 2021-10-22 11:31:29Z

1

Or you can just keep the categories and add to them

let categories = ["Womens", "Accessories", "Bags", "Sport- & Travel Bags"];
let rootName = "hierarchicalCategories.lvl";
let level = "";
categories.map((e, index) => {
  level += e;
  console.log(rootName + index + " : " + level);
  level += " > ";
});

answered Oct 22, 2021 at 11:31

Gabriel

6901 gold badge8 silver badges26 bronze badges

Collectives™ on Stack Overflow

Script JS transform array

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related