logo

Dividi un array in blocchi in JavaScript

Suddivisione di un array in blocchi in JavaScript comporta la divisione dell'array in array più piccoli di una dimensione specificata. Questo processo è utile per gestire set di dati di grandi dimensioni in modo più efficiente o per elaborare i dati in porzioni più piccole e più gestibili all'interno dell'applicazione.

Metodi per dividere l'array in blocchi:



Tabella dei contenuti

Utilizzando il metodo JavaScript slice()

IL metodo slice() restituisce un nuovo array contenente gli elementi selezionati. Questo metodo seleziona gli elementi a partire dall'argomento iniziale specificato e termina con, ma escludendo l'argomento finale specificato.

Sintassi:



array.slice(start, end);>

Esempio: Questo esempio utilizza il file fetta() metodo per dividere l'array in blocchi dell'array. Questo metodo può essere utilizzato ripetutamente per dividere un array di qualsiasi dimensione.

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);>

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

Utilizzando il metodo JavaScript splice()

metodo splice() aggiunge/rimuove elementi a/da un array e restituisce l'elenco degli elementi rimossi.

Sintassi:



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

Esempio: Questo esempio utilizza il file giunzione() metodo per dividere l'array in blocchi dell'array. Questo metodo rimuove gli elementi dall'array originale. Questo metodo può essere utilizzato ripetutamente per dividere un array di qualsiasi dimensione.

javafx su eclissi
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);>

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

Utilizzando Metodo Lodash _.chunk()

In questo approccio, stiamo utilizzando Metodo Lodash _.chunk() che restituisce l'array specificato in blocchi in base al valore specificato.

Esempio: In questo esempio, stiamo suddividendo l'array passando la dimensione '3' nel metodo _.chunk(). La dimensione del blocco può essere variata ed è possibile utilizzare array di diversi tipi di dati con la funzione blocco.

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))>

Produzione:

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

Utilizzo di un loop per dividere l'array

In questo approccio, iteriamo sull'array originale e lo suddividiamo in blocchi della dimensione desiderata, inserendo ciascun blocco in un nuovo array.

Esempio:

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);>

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

Utilizzando Array.reduce()

Utilizzando Array.reduce() , divide un array in blocchi di una dimensione specificata. La funzione reduce accumula blocchi in base a ChunkSize, inserendo porzioni affettate dell'array nell'array Chunks e restituisce l'array di blocchi risultante.

Esempio: In questo esempio dividiamo un array in blocchi di una dimensione specificata utilizzando il metodo reduce. Itera attraverso l'array, inserendo sottoarray della dimensione del blocco definita in un array risultante.

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 (indice % pezzo === 0) { risultato.push(arr.slice(indice, indice + pezzo));  } restituisce il risultato; }, []); // Visualizza l'output splittedArrays.forEach((subArray, indice) => { console.log(`Array${index + 1}: ${subArray}`); });>

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

Utilizzando Array.from() e Array.splice()

Questo metodo prevede la creazione di un nuovo array dall'array originale utilizzando Array.from() e la successiva rimozione ripetuta di elementi da esso utilizzando splice() per formare blocchi.

Esempio: In questo esempio la funzione ChunkArray divide un array in blocchi di una dimensione specificata. Crea una copia dell'array originale ed estrae in modo iterativo porzioni in base alla dimensione del blocco finché l'array non è vuoto.

JavaScript
function chunkArray(array, chunkSize) {  const chunks = [];  const copyArray = Array.from(array); // Create a copy of the original array  while (copyArray.length>0) { pezzi.push(copyArray.splice(0, ChunkSize));  } restituisce pezzi; } // Esempio di utilizzo: const arr = [1, 2, 3, 4, 5, 6, 'a', 'b', 'c', 'd']; const dimensione pezzo = 3; const pezzi = ChunkArray(arr, ChunkSize); console.log(pezzi);>

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