Way to create and fill arrays at set length in JavaScript?

Question

For example:

I have 100+ location objects, each containing latitude: x, longitude: x values. These are in one long array.

I am using these with the Google distance matrix API to calculate nearby stores for my user. The problem is this API has a limit of 25 destinations per request, so I can't use my array of location objects as it is too big.

I am looking for a way to make multiple arrays at a max length of 25, and when that array fills, create a new one. A function that does this would be best, so that it works for any number of stores.

I don't think you can limit arrays to a certain size. Maybe if you use a proxy? — evolutionxbox, Jan 21 '20 at 11:09
Are you looking for [chunking](https://stackoverflow.com/questions/8495687/split-array-into-chunks)? — VLAZ, Jan 21 '20 at 11:11
`a = new Proxy([], { set (arr, key, value) { if (arr.length < 26) { arr[key] = value; return value; } throw new Error('Max number of items reached. Arrays cannot contain more than 25 items.'); } });` - this might be helpful? — evolutionxbox, Jan 21 '20 at 11:14
Did you know that you can [slice](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice) your array? — some, Jan 21 '20 at 11:16
Sounds like you need to create a recursive function that calls on itself once the the size has reached 25 and create new array. Give some code so people can help you easily — feedy, Jan 21 '20 at 11:28

Ziv Ben-Or · Accepted Answer · 2020-01-22T09:10:07.727

What about that:

const locationObjects = [
    {latitude: 1, longitude:1},
    {latitude: 2, longitude:2},
    {latitude: 3, longitude:3},
    {latitude: 4, longitude:4},
    {latitude: 5, longitude:5},
    {latitude: 6, longitude:6},
    {latitude: 7, longitude:7},
    {latitude: 8, longitude:8},
    {latitude: 9, longitude:9},
    {latitude: 10, longitude:10},
    {latitude: 11, longitude:11},
    {latitude: 12, longitude:12},
    {latitude: 13, longitude:13},
    {latitude: 14, longitude:14},
    {latitude: 15, longitude:15},
    {latitude: 16, longitude:16},
    {latitude: 17, longitude:17},
    {latitude: 18, longitude:18},
    {latitude: 19, longitude:19},
    {latitude: 20, longitude:20},
    {latitude: 21, longitude:21},
    {latitude: 22, longitude:22},
    {latitude: 23, longitude:23},
    {latitude: 24, longitude:24},
    {latitude: 25, longitude:25},
    {latitude: 26, longitude:26},
]

let locations = [];
while(locationObjects.length){
    locations.push(locationObjects.splice(0, 25))
}
console.log(locations)

New Coder · Answer 2 · 2020-01-21T11:40:52.650

You can use array of arrays to store you location objects, every time an index with filled with an array of 25 elements, push new array into the main array and then start pushing new locations into that until you reach 25. something like this maybe?

let locations = [[]];
let currentIndex = 0;

function addLocation(location) {
    if (locations[currentIndex].length < 24) {
        locations[currentIndex].push(location);
    } else {
        locations.push([]);
        locations[currentIndex++].push(location); 
    }
}

score 0 · Answer 3 · answered Jan 21 '20 at 13:01

Here's a solution that uses a helper function called handleArrayInChunks, which calls itself recursively as needed.

It takes four arguments: the original ("big") array, the chunk size, a chunkHandler function to call with each chunk, and an optional currentIndex, which defaults to zero.

See the in-code comments for further explanation.

// Defines an array of 110 items
const genericArray = Array.from({ length: 110 }).fill("someLocationObject");

// Invokes handleArrayInChunks (w/ default `currentIndex` value)
handleArrayInChunks(genericArray, 25, sendToGoogle);

// Defines handleArrayInChunks function
function handleArrayInChunks(bigArray, chunkSize, chunkHandler, currentIndex = 0){

  // Makes an array no larger than `chunkSize`
  let
    remainingCount = bigArray.length - currentIndex,
    nextChunkLength = Math.min(remainingCount, chunkSize),
    nextChunk = bigArray.slice(currentIndex, currentIndex + nextChunkLength);

  // Invokes the callback function to handle this chunk
  chunkHandler(nextChunk);

  // Sets the index for the next chunk
  currentIndex += chunkSize;

  // Calls handleArrayInChunks again if we aren't finished
  if(currentIndex < bigArray.length){
    handleArrayInChunks(bigArray, chunkSize, chunkHandler, currentIndex);
  }
}

// Defines a function to use as the chunkHandler function
function sendToGoogle(smallArray){
  console.log("passing " + smallArray.length + " items to API");
  // Here, call the desired API method with this chunk
}

Way to create and fill arrays at set length in JavaScript?

3 Answers3