push element of array to object as value

Question

I want to change an array to object like this :

array = ["blue" , "txt2" , "red" ,"txt4" , "txt5" , "txt6" ,"txt7" , "txt8" , "txt9" ]
   
pages = {"page1" :["blue","txt2", "red"] , "page2" : ["txt4", "txt5", "txt6"], "page3" : ["txt7" ,"txt8", "txt9"]

Every key in pages object should have an array value with 3 elements of array (the last key can have less) , so for example if an array have 110 elements we will have 37 pages (page1 , page 2 , ... , page37) and page37 will have 1 elements.

So I want put every 3 elements in array as value of a key in the pages object

But I don't know how to do it.. Thank you for your help

Is there a reason for creating an object with incremental keys? Why not create an array of arrays? — adiga, Dec 22 '21 at 12:58
@adiga It might be so the code can directly display the keys as page numbers on the HTML page, although indeed displaying "Go to page1" is strange — ophact, Dec 22 '21 at 13:00

Saeed Shamloo · Accepted Answer · 2021-12-22T14:04:56.993

You can do it by iterating over array and extract 3 items from array on every iteration by using splice method, like this:

let array = ["blue" , "txt2" , "red" ,"txt4" , "txt5" , "txt6" ,"txt7" , "txt8" , "txt9", "text10" ]
let pages= {}, i= 1;
while(array.length > 0){
    pages[`page${i++}`] = array.splice(0,3)
}

console.log(pages)

with this manner, you loose the original values in the array, if you want to keep items in the array untuched, you can make copy of your original data like let copiedArray = [...array] and then call splice method on the copiedArray and also check the length of copiedArray in the while.

score 0 · Answer 2 · answered Dec 22 '21 at 12:59

0

Get every third index and add all the elements from that point to that point plus three (if that index is near the end it won't error; it will just add the remaining elements):

const initial = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j'];

let paginated = {};
let counter = 0

while (counter < initial.length) {
 paginated['page' + parseInt(counter / 3 + 1)] = initial.slice(counter, counter + 3);
 counter += 3;
}
 
console.log(paginated);

answered Dec 22 '21 at 12:59

ophact

126
5

Just a small remark. It's a bit weird to have a while loop when you define a counter and use this counter as a condition to end the loop. This feels like an ideal job for a simple for loop :) – Wimanicesir Dec 22 '21 at 13:09
@Wimanicesir Indeed, and I knew that. I was just used to using while-loops in Python for incrementing counters up to a certain point ;) – ophact Dec 22 '21 at 13:10

pilchard · Answer 3 · 2021-12-22T13:34:10.807

For a more configurable solution you might look to a chunk utility function for the initial division of the input array, and then map that as desired to your result object (here using Object.fromEntries and mapping over the resulting chunked array to assign 'page' keys based on index).

function chunk(arr, chunkSize) {
  const result = [];
  for (let i = 0; i < arr.length; i += chunkSize) {
    result.push(arr.slice(i, i + chunkSize));
  }

  return result;
}

const array = ['blue', 'txt2', 'red', 'txt4', 'txt5', 'txt6', 'txt7', 'txt8', 'txt9'];

const result = Object.fromEntries(
    chunk(array, 3).map((chunk, index) => [`page${index + 1}`, chunk])
);

console.log(result);

see: Split array into chunks for discussion.

push element of array to object as value

3 Answers3