Comment diviser un tableau long en tableaux plus petits, avec JavaScript

j'ai un tableau d'e-mails (c'est peut être juste 1 e-mail, ou 100 e-mails), et j'ai besoin d'envoyer le tableau avec une requête ajax (que je sais comment le faire), mais je ne peux envoyer un tableau qui a 10 ou moins d'e-mails. Donc s'il y a un tableau original de 20 e-mails je vais avoir besoin de les diviser en 2 tableaux de 10 chacun. ou s'il y a 15 e-mails dans le tableau original, alors 1 Tableau de 10, et un autre tableau de 5. J'utilise jQuery, quelle serait la meilleure façon de faire ça?

54
demandé sur David Thomas 2011-09-01 20:52:27

14 réponses

N'utilisez pas jquery...utiliser le javascript simple

var a = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];

var b = a.splice(0,10);

//a is now [11,12,13,14,15];
//b is now [1,2,3,4,5,6,7,8,9,10];

vous pouvez boucler ceci pour obtenir le comportement que vous voulez.

var a = YOUR_ARRAY;
while(a.length) {
    console.log(a.splice(0,10));
}

cela vous donnerait 10 éléments à la fois...si vous avez dit 15 éléments, vous obtiendriez 1-10, le 11-15 comme vous vouliez.

124
répondu jyore 2011-09-01 17:02:46
var size = 10; var arrayOfArrays = [];
for (var i=0; i<bigarray.length; i+=size) {
     arrayOfArrays.push(bigarray.slice(i,i+size));
}
console.log(arrayOfArrays);

contrairement à splice() , slice() est non destructif par rapport au tableau d'origine.

69
répondu Blazemonger 2018-07-19 05:08:56

bouclez juste le tableau, en l'épissantjusqu'à ce qu'il soit entièrement consommé.



var a = ['a','b','c','d','e','f','g']
  , chunk

while (a.length > 0) {

  chunk = a.splice(0,3)

  console.log(chunk)

}

sortie


[ 'a', 'b', 'c' ]
[ 'd', 'e', 'f' ]
[ 'g' ]

23
répondu Claudio 2011-09-01 16:59:33

vous pouvez utiliser lodash: https://lodash.com/docs

_.chunk(['a', 'b', 'c', 'd'], 2);
// → [['a', 'b'], ['c', 'd']]
20
répondu AlexParamonov 2015-04-07 17:26:30

en supposant que vous ne voulez pas détruire le tableau original, vous pouvez utiliser le code comme ceci pour briser le tableau long en tableaux plus petits que vous pouvez ensuite itérer plus:

var longArray = [];   // assume this has 100 or more email addresses in it
var shortArrays = [], i, len;

for (i = 0, len = longArray.length; i < len; i += 10) {
    shortArrays.push(longArray.slice(i, i + 10));
}

// now you can iterate over shortArrays which is an 
// array of arrays where each array has 10 or fewer 
// of the original email addresses in it

for (i = 0, len = shortArrays.length; i < len; i++) {
    // shortArrays[i] is an array of email addresss of 10 or less
}
9
répondu jfriend00 2011-09-01 17:00:35

comme complément au de @jyore "réponse , et dans le cas où vous voulez toujours garder le tableau original:

var originalArray = [1,2,3,4,5,6,7,8];

var splitArray = function (arr, size) {

  var arr2 = arr.slice(0),
      arrays = [];

  while (arr2.length > 0) {
      arrays.push(arr2.splice(0, size));
  }

  return arrays;
}

splitArray(originalArray, 2);
// originalArray is still = [1,2,3,4,5,6,7,8];
5
répondu Justin 2017-05-23 11:47:22

je voudrais partager ma solution. C'est un peu plus détaillé, mais fonctionne aussi bien.

var data = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];

var chunksize = 4;


var chunks = [];

data.forEach((item)=>{
  if(!chunks.length || chunks[chunks.length-1].length == chunksize)
  chunks.push([]);

  chunks[chunks.length-1].push(item);
});

console.log(chunks);

sortie (formatée):

[ [ 1,  2,  3,  4],
  [ 5,  6,  7,  8],
  [ 9, 10, 11, 12],
  [13, 14, 15    ] ]
3
répondu Filipe Nicoli 2017-10-27 12:09:02

une autre méthode:

var longArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var size = 2;

var newArray = new Array(Math.ceil(longArray.length / size)).fill("")
    .map(function() { return this.splice(0, size) }, longArray.slice());

// newArray = [[1, 2], [3, 4], [5, 6], [7, 8], [9, 10]];

cela n'affecte pas le tableau original car une copie, faite en utilisant slice, est passée dans l'argument 'ceci' de map.

2
répondu AFurlepa 2017-03-08 16:09:16

une Autre mise en œuvre:

const arr = ["H", "o", "w", " ", "t", "o", " ", "s", "p", "l", "i", "t", " ", "a", " ", "l", "o", "n", "g", " ", "a", "r", "r", "a", "y", " ", "i", "n", "t", "o", " ", "s", "m", "a", "l", "l", "e", "r", " ", "a", "r", "r", "a", "y", "s", ",", " ", "w", "i", "t", "h", " ", "J", "a", "v", "a", "S", "c", "r", "i", "p", "t"];

const size = 3; 
const res = arr.reduce((acc, curr, i) => {
  if ( !(i % size)  ) {    // if index is 0 or can be divided by the `size`...
    acc.push(arr.slice(i, i + size));   // ..push a chunk of the original array to the accumulator
  }
  return acc;
}, []);

// => [["H", "o", "w"], [" ", "t", "o"], [" ", "s", "p"], ["l", "i", "t"], [" ", "a", " "], ["l", "o", "n"], ["g", " ", "a"], ["r", "r", "a"], ["y", " ", "i"], ["n", "t", "o"], [" ", "s", "m"], ["a", "l", "l"], ["e", "r", " "], ["a", "r", "r"], ["a", "y", "s"], [",", " ", "w"], ["i", "t", "h"], [" ", "J", "a"], ["v", "a", "S"], ["c", "r", "i"], ["p", "t"]]

NB-cela ne modifie pas le tableau original.

ou, si vous préférez une méthode fonctionnelle, immuable et autonome:

function splitBy(size, list) {
  return list.reduce((acc, curr, i, self) => {
    if ( !(i % size)  ) {  
      return [
          ...acc,
          self.slice(i, i + size),
        ];
    }
    return acc;
  }, []);
}
2
répondu Nobita 2017-05-24 11:38:57

vous pouvez jeter un oeil à ce code . Simple et efficace .

function chunkArrayInGroups(array, unit) {
var results = [],
length = Math.ceil(array.length / unit);

for (var i = 0; i < length; i++) {
    results.push(array.slice(i * unit, (i + 1) * unit));
}
 return results;
}

chunkArrayInGroups(["a", "b", "c", "d"], 2);
1
répondu Subhankar 2016-03-29 13:41:54

Voici une simple doublure

var segment = (arr, n) => arr.reduce((r,e,i) => i%n ? (r[r.length-1].push(e), r)
                                                    : (r.push([e]), r), []),
        arr = Array.from({length: 31}).map((_,i) => i+1);
console.log(segment(arr,7));
1
répondu Redu 2017-05-23 11:43:35

si vous voulez une méthode qui ne modifie pas le tableau existant, essayez ceci:

let oldArray = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
let newArray = [];
let size = 3; // Size of chunks you are after
let j = 0; // This helps us keep track of the child arrays

for (var i = 0; i < oldArray.length; i++) {
  if (i % size === 0) {
    j++
  }
  if(!newArray[j]) newArray[j] = [];
  newArray[j].push(oldArray[i])
}
0
répondu Ryan 2016-07-27 00:10:26

une autre implémentation, utilisant Array.réduire (je pense que c'est le seul qui manque!):

const splitArray = (arr, size) =>
{
    if (size === 0) {
        return [];
    }

    return arr.reduce((split, element, index) => {
        index % size === 0 ? split.push([element]) : split[Math.floor(index / size)].push(element);
        return split;
    }, []);
};

comme beaucoup de solutions ci-dessus, celle-ci est non destructive. Retourner un tableau vide quand la taille est 0 est juste une convention. Si le if bloc est omis vous obtenez une erreur, qui pourrait être ce que vous voulez.

0
répondu Alf 2017-04-18 10:01:50
function chunkArrayInGroups(arr, size) {
    var newArr=[];

    for (var i=0; arr.length>size; i++){
    newArr.push(arr.splice(0,size));
    }
    newArr.push(arr.slice(0));
    return newArr;

}

chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3);
0
répondu zgthompson 2018-02-25 21:24:14