Scripting de l'algorithme de base en découpant le tableau avec la fonction splice en Javascript

Question

Maintenant je travaille sur un exercice dans freecodecamp. Actuellement, j'ai une erreur logique mais je ne sais pas pourquoi l'échec se produit.

Dans le code, je dois construire une fonction, qui coupe le tableau d'entrée en fonction du paramètre. Le résultat du test doit être le suivant :

chunkArrayInGroups(["a", "b", "c", "d"], 2) should return [["a", "b"], ["c", "d"]].
chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3) should return [[0, 1, 2], [3, 4, 5]].
chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 4) should return [[0, 1, 2, 3], [4, 5, 6, 7], [8]].
chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2) should return [[0, 1], [2, 3], [4, 5], [6, 7], [8]].

Et mon code est le suivant :

function chunkArrayInGroups(arr, size) {
  var array = [];
  for (var x = 0; x < arr.length ; x+=size){
    var spliceArr = arr.splice(0,size);
    array.push(spliceArr);
  }
  array.push(arr);
  return array;
}

chunkArrayInGroups(["a", "b", "c", "d","e"], 2);

Pour la plupart des conditions, le code fonctionne. Mais pour la dernière condition, c'est-à-dire

chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2) should return [[0, 1], [2, 3], [4, 5], [6, 7], [8]].

dans ce cas, je n'arrive pas à obtenir la bonne réponse. J'ai testé dans le journal de la console, et il s'avère que le résultat est le suivant

[[0, 1], [2, 3], [4, 5], [6, 7, 8]].

Je sais que ce n'est pas une question difficile et qu'il y a beaucoup de meilleures façons de l'aborder, mais puis-je savoir quel est le défaut de logique dans ce code ? Merci beaucoup !

Answer 1

Au lieu de splice utiliser slice . Cela garantit également que le tableau original n'est pas modifié.

Comme ceci ( Démonstration de travail ) :

function chunkArrayInGroups(arr, size) {
  var array = [];
  for (var x = 0; x < arr.length; x += size) {
     // take elements from current index (`x`) to `x` + `size`
     // (do not remove them from the original array, so the original size is not modified either)
    var sliceArr = arr.slice(x, x + size);
    array.push(sliceArr);
  }
  return array;
}

console.log(chunkArrayInGroups(["a", "b", "c", "d"], 2)); //should return [["a", "b"], ["c", "d"]].
console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3)); // should return [[0, 1, 2], [3, 4, 5]].
console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 4)); // should return [[0, 1, 2, 3], [4, 5, 6, 7], [8]].
console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2)); // should return [[0, 1], [2, 3], [4, 5], [6, 7], [8]]

Answer 2

Il pourrait être utile d'ajouter un console.log(arr) à votre boucle pour voir comment le tableau change au fil du temps.

Vous verrez que cela ressemble à ceci :

[0, 1, 2, 3, 4, 5, 6, 7, 8]
[2, 3, 4, 5, 6, 7, 8]
[4, 5, 6, 7, 8]

Ensuite, tenez compte de la jonction finale et de l'ajout qui se produit en dehors de la boucle :

[6, 7, 8]

Puisque votre boucle incrémente par size il sortira une fois qu'il aura rassemblé tous les sous-réseaux d'exactement size .

Je vous recommande plutôt de continuer jusqu'à ce que votre entrée soit vide :

function chunkArrayInGroups(arr, size) {
  var array = [];
  while(arr.length > 0){
    var spliceArr = arr.splice(0,size);
    array.push(spliceArr);
  }
  return array;
}

Answer 3

Vous voudrez utiliser la taille pour économiser sur le nombre de boucles dans le tableau. Nous sauvegardons également la longueur afin qu'elle ne soit pas récupérée à chaque fois, ce qui permet d'économiser des opérations. Vous remarquerez également que je n'utilise pas la fonction var car vous ne devriez pas l'utiliser. Veuillez utiliser let pour les variables normales et const pour les variables que vous n'allez pas réaffecter.

function chunkArrayInGroups(arr, size) {
  let array = [];
  let arrayLength = arr.length;
  for (let i = 0; i < arrayLength; i+=size) {
    array.push(arr.slice(i, i+size));
  }
  return array
}

console.log(chunkArrayInGroups(["a", "b", "c", "d"], 2), [["a", "b"], ["c", "d"]])
console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3), [[0, 1, 2], [3, 4, 5]])
console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 4), [[0, 1, 2, 3], [4, 5, 6, 7], [8]])
console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2), [[0, 1], [2, 3], [4, 5], [6, 7], [8]])

Answer 4

Le problème ici est que vous réduisez la longueur du tableau tout au long de votre itération. C'est-à-dire que votre tableau devient plus petit à chaque itération alors que votre x augmente continuellement. Cela signifie qu'avant votre dernière itération, votre x sera à 6 et la longueur du tableau sera de 3, donc x < arr.length évalue à false et votre dernière itération n'a pas lieu. La solution la plus simpliste à laquelle je peux penser est de stocker la longueur du tableau original dans une variable que j'ai nommée stop et supprimer la poussée finale non nécessaire du tableau en dehors de la boucle.

function chunkArrayInGroups(arr, size) {
  var array = [];
  var stop = arr.length;
  for (var x = 0; x < stop; x+=size){
    var spliceArr = arr.splice(0,size);
    array.push(spliceArr);
  }
  return array;
}

console.log(chunkArrayInGroups([1,2,3,4,5,6,7], 2))

Answer 5

splice change la longueur du tableau à chaque itération. C'est pourquoi votre boucle se termine avant que vous ne l'attendiez. Vous pouvez en savoir plus sur le splice ici .

Contrairement à splice , slice ne supprimera pas les éléments du tableau, c'est pourquoi la réponse de lealceldeiro fonctionnera comme prévu.

La réponse de Kevin Bruccoleri semble plus propre et plus courte mais si vous avez une application où vous stockez un tableau dans une variable et que vous le passez ensuite à la fonction, cette variable sera vide après l'exécution de la fonction, ce qui peut entraîner des bogues dans votre application. C'est pourquoi les tableaux sont fondamentalement des objets, mais c'est de la science-fiction en javascript.

function chunkArrayInGroups(arr, size) {
  var array = [];
  while (arr.length) {
    array.push(arr.splice(0, size))
  }
  return array
}

var nums = [0, 1, 2, 3, 4, 5, 6, 7, 8]
console.log('now it full', nums);
console.log(chunkArrayInGroups(nums, 2));
console.log('now it empty', nums);