logo

Teilen Sie ein Array in JavaScript in Blöcke auf

Aufteilen eines Arrays in Blöcke in JavaScript beinhaltet die Aufteilung des Arrays in kleinere Arrays einer bestimmten Größe. Dieser Prozess ist nützlich, um große Datenmengen effizienter zu verwalten oder Daten in kleineren, besser verwaltbaren Teilen innerhalb der Anwendung zu verarbeiten.

Methoden zum Aufteilen des Arrays in Blöcke:



Inhaltsverzeichnis

Verwendung der JavaScript-Methode „slice()“.

Der Slice()-Methode gibt ein neues Array zurück, das die ausgewählten Elemente enthält. Diese Methode wählt die Elemente aus, die mit dem angegebenen Startargument beginnen und enden, jedoch ohne das angegebene Endargument.

Syntax:



array.slice(start, end);>

Beispiel: In diesem Beispiel wird die verwendet Scheibe() Methode zum Aufteilen des Arrays in Teile des Arrays. Diese Methode kann wiederholt verwendet werden, um ein Array beliebiger Größe aufzuteilen.

Javascript
// Size of chunk let chunk = 4; // Input array let arr = [1, 2, 3, 4, 5, 6, 7, 8]; // Spiltted arrays let arr1 = arr.slice(0, chunk); let arr2 = arr.slice(chunk, chunk + arr.length); // Display Output console.log('Array1: ' + arr1 + '
Array2: ' + arr2);>

Ausgabe
Array1: 1,2,3,4 Array2: 5,6,7,8>

Verwendung der JavaScript-Methode splice()

splice()-Methode Fügt Elemente zu bzw. aus einem Array hinzu bzw. entfernt sie und gibt die Liste der entfernten Elemente zurück.

Syntax:



array.splice(index, number, item1, ....., itemN);>

Beispiel: In diesem Beispiel wird die verwendet spleißen() Methode zum Aufteilen des Arrays in Teile des Arrays. Diese Methode entfernt die Elemente aus dem ursprünglichen Array. Diese Methode kann wiederholt verwendet werden, um ein Array beliebiger Größe aufzuteilen.

Selen lernen
Javascript
// Size of aaray chunks let chunk = 2; // Input array let arr = [1, 2, 3, 4, 5, 6, 7, 8]; // Splitted arrays let arr1 = arr.splice(0, chunk); let arr2 = arr.splice(0, chunk); let arr3 = arr.splice(0, chunk); let arr4 = arr.splice(0, chunk); // Display output console.log('Array1: ' + arr1); console.log('Array2: ' + arr2); console.log('Array3: ' + arr3); console.log('Array4: ' + arr4);>

Ausgabe
Array1: 1,2 Array2: 3,4 Array3: 5,6 Array4: 7,8>

Benutzen Lodash _.chunk() Methode

Bei diesem Ansatz verwenden wir Lodash _.chunk()-Methode das gibt das angegebene Array in Blöcken entsprechend dem angegebenen Wert zurück.

Beispiel: In diesem Beispiel unterbrechen wir das Array, indem wir die Größe „3“ an die Methode _.chunk() übergeben. Die Größe des Blocks kann variiert werden und Arrays unterschiedlicher Datentypen können mit der Chunk-Funktion verwendet werden.

Javascript
// Requiring the lodash module // in the script let _ = require('lodash'); let arr = [1, 2, 3, 4, 5, 6,  'a', 'b', 'c', 'd']; console.log('Before: ', arr) // Making chunks of size 3 console.log('After: ', _.chunk(arr, 3))>

Ausgabe:

Before: [  1, 2, 3, 4, 5,  6, 'a', 'b', 'c', 'd' ] After: [ [ 1, 2, 3 ], [ 4, 5, 6 ], [ 'a', 'b', 'c' ], [ 'd' ] ]>

Verwenden einer Schleife zum Teilen des Arrays

Bei diesem Ansatz iterieren wir über das ursprüngliche Array und teilen es in Blöcke mit der gewünschten Größe auf, wobei wir jeden Block in ein neues Array verschieben.

Beispiel:

JavaScript
function chunkArray(array, chunkSize) {  const chunks = [];  for (let i = 0; i < array.length; i += chunkSize) {  chunks.push(array.slice(i, i + chunkSize));  }  return chunks; } const arr = [1, 2, 3, 4, 5, 6, 7, 8]; const chunkedArray = chunkArray(arr, 4); console.log(chunkedArray);>

Ausgabe
[ [ 1, 2, 3, 4 ], [ 5, 6, 7, 8 ] ]>

Verwenden von Array.reduce()

Benutzen Array.reduce() , teilen Sie ein Array in Blöcke einer bestimmten Größe auf. Die Reduzierungsfunktion akkumuliert Chunks basierend auf chunkSize, verschiebt geschnittene Teile des Arrays in das Chunks-Array und gibt das resultierende Chunk-Array zurück.

Beispiel: In diesem Beispiel teilen wir ein Array mithilfe der Reduce-Methode in Blöcke einer bestimmten Größe auf. Es durchläuft das Array und schiebt Unterarrays der definierten Blockgröße in ein resultierendes Array.

JavaScript
// Size of chunk let chunk = 4; // Input array let arr = [1, 2, 3, 4, 5, 6, 7, 8]; // Split array into chunks using reduce method let splittedArrays = arr.reduce((result, item, index) =>{ if (index % chunk === 0) { result.push(arr.slice(index, index + chunk));  } Ergebnis zurückgeben; }, []); // Ausgabe anzeigen splittedArrays.forEach((subArray, index) => { console.log(`Array${index + 1}: ${subArray}`); });>

Ausgabe
Array1: 1,2,3,4 Array2: 5,6,7,8>

Verwenden von Array.from() und Array.splice()

Bei dieser Methode wird mithilfe von Array.from() ein neues Array aus dem ursprünglichen Array erstellt und anschließend mithilfe von splice() wiederholt Elemente daraus entfernt, um Blöcke zu bilden.

Beispiel: In diesem Beispiel teilt die Funktion chunkArray ein Array in Blöcke einer angegebenen Größe auf. Es erstellt eine Kopie des ursprünglichen Arrays und extrahiert iterativ Teile basierend auf der Blockgröße, bis das Array leer ist.

JavaScript
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));  } Stücke zurückgeben; } // Beispielverwendung: const arr = [1, 2, 3, 4, 5, 6, 'a', 'b', 'c', 'd']; const chunkSize = 3; const chunks = chunkArray(arr, chunkSize); console.log(chunks);>

Ausgabe
[ [ 1, 2, 3 ], [ 4, 5, 6 ], [ 'a', 'b', 'c' ], [ 'd' ] ]>