Array in Stücke aufteilen

Question

Nehmen wir an, dass ich ein Javascript-Array habe, das wie folgt aussieht:

["Element 1","Element 2","Element 3",...]; // with close to a hundred elements.

Welcher Ansatz wäre angemessen, um das Array in viele kleinere Arrays mit, sagen wir, höchstens 10 Elementen aufzuteilen?

Answer 1

Mein Ziel war es, eine einfache, nicht-mutierende Lösung in reinem ES6 zu erstellen. Eigenheiten in Javascript machen es notwendig, das leere Array vor dem Mapping zu füllen :-(

function chunk(a, l) { 
    return new Array(Math.ceil(a.length / l)).fill(0)
        .map((_, n) => a.slice(n*l, n*l + l)); 
}

Diese Version mit Rekursion scheint einfacher und überzeugender zu sein:

function chunk(a, l) { 
    if (a.length == 0) return []; 
    else return [a.slice(0, l)].concat(chunk(a.slice(l), l)); 
}

Die lächerlich schwachen Array-Funktionen von ES6 sorgen für gute Rätsel :-)

Answer 2

Ein npm-Paket für dieses Projekt erstellt https://www.npmjs.com/package/array.chunk

var result = [];

for (var i = 0; i < arr.length; i += size) {
  result.push(arr.slice(i, size + i));
}
return result;

Bei Verwendung eines TypedArray

var result = [];

for (var i = 0; i < arr.length; i += size) {
  result.push(arr.subarray(i, size + i));
}
return result;

Answer 3

Verwendung von Array.prototype.splice() und spleißt es, bis das Array ein Element hat.

Array.prototype.chunk = function(size) {
    let result = [];

    while(this.length) {
        result.push(this.splice(0, size));
    }

    return result;
}

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(arr.chunk(2));

Update

Array.prototype.splice() das ursprüngliche Array auffüllt und nach der Durchführung der chunk() das ursprüngliche Array ( arr ) wird [] .

Wenn Sie also das ursprüngliche Array unangetastet lassen wollen, kopieren Sie und behalten Sie die arr Daten in ein anderes Array zu übertragen und das Gleiche zu tun.

Array.prototype.chunk = function(size) {
  let data = [...this];  
  let result = [];

    while(data.length) {
        result.push(data.splice(0, size));
    }

    return result;
}

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log('chunked:', arr.chunk(2));
console.log('original', arr);

P.S.: Dank an @mts-knn für den Hinweis auf die Angelegenheit.

Answer 4

Ich empfehle die Verwendung von lodash. Chunking ist eine der vielen nützlichen Funktionen dort. Anweisungen:

npm i --save lodash

In Ihr Projekt einbeziehen:

import * as _ from 'lodash';

Verwendung:

const arrayOfElements = ["Element 1","Element 2","Element 3", "Element 4", "Element 5","Element 6","Element 7","Element 8","Element 9","Element 10","Element 11","Element 12"]
const chunkedElements = _.chunk(arrayOfElements, 10)

Mein Muster finden Sie hier: https://playcode.io/659171/

Answer 5

Der folgende ES2015-Ansatz funktioniert ohne die Definition einer Funktion und direkt auf anonymen Arrays (Beispiel mit Chunk-Größe 2):

[11,22,33,44,55].map((_, i, all) => all.slice(2*i, 2*i+2)).filter(x=>x.length)

Wenn Sie dafür eine Funktion definieren wollen, könnten Sie dies wie folgt tun (in Anlehnung an K._s Kommentar zu Blazemonger's Antwort ):

const array_chunks = (array, chunk_size) => array
    .map((_, i, all) => all.slice(i*chunk_size, (i+1)*chunk_size))
    .filter(x => x.length)