W poprzedniej lekcji poznaliśmy genialny sposób na zamienienie tablicy na chunki odpowiedniej maksymalnej wielkości. Teraz poznamy jeszcze 3 inne metody.

Oto poprzednie, genialne rozwiązanie:

const chunk = (arr, size) =>
    Array.from({ length: Math.ceil(arr.length / size) }, (v, i) =>
      arr.slice(i * size, i * size + size)
    );
  
console.log(chunk([1, 2, 3, 4, 5], 2)); 
// [[1, 2], [3, 4], [5]]

Pierwsze kreatywne podejście to użycie reduce z akumulatorem tablicowym oraz modulo warunkiem:

function reduceChunkArr(arr, chunkSize){

    return arr.reduce((result, item, index) => {
        if (index % chunkSize === 0) {
            result.push(arr.slice(index, index + chunkSize));
        }
        return result;
    }, []);
}

for(let chunk of reduceChunkArr([1,2,3,4,5], 2))
    console.log(chunk);

//[1,2]
//[3,4]
//[5]

Drugi kreatywny sposób to wykorzystanie splice:

function chunkArray(array, chunkSize) {
    const chunks = [];
    const copyArray = Array.from(array); // Create a copy of the original array

    while (copyArray.length > 0) {
        chunks.push(copyArray.splice(0, chunkSize));
    }

    return chunks;
}

for(let chunk of chunkArray([1,2,3,4,5], 2))
    console.log(chunk);

//[1,2]
//[3,4]
//[5]

Przypomnijmy – splice usuwa elementy od podanego indeksu aż do n elementów (drugi argument to liczba usuwanych elementów, nie indeks) i te elementy zwraca. Tak działa ta funkcja.

Ok, trzeci patent jest z generatorem i podoba mi się najbardziej:

const chunkify = function* (itr, size) {
    let chunk = [];
    for (const v of itr) {
      chunk.push(v);
      if (chunk.length === size) {
        yield chunk;
        chunk = [];
      }
    }
    if (chunk.length) yield chunk;
  };
  
  const x = [1,2,3,4,5];
  
  for(let chunk of chunkify(x, 2))
    console.log(chunk)

//[1,2]
//[3,4]
//[5]

W tym patencie najlepsze jest to, że działa na wszystkie iterables. Plus logika jest dość czytelna. Pętla, dodaje do chunka elementy aż zostanie zapełniony chunk, wtedy yield.

Jeżeli zostanie jeszcze jakiś „leftover”, który coś tam w sobie ma choć limitu wielkości nie wypełnił, to też yield. Pętla for…of i wszystko ładnie-pięknie, jak w nowoczesnym JS wypada.