web-dev-qa-db-fra.com

Comment puis-je ajouter de nouveaux éléments de tableau au début d'un tableau en Javascript?

J'ai besoin d'ajouter ou d'ajouter des éléments au début d'un tableau.

Par exemple, si mon tableau ressemble à celui ci-dessous:

[23, 45, 12, 67]

Et la réponse de mon appel AJAX est 34, je veux que le tableau mis à jour soit comme suit:

[34, 23, 45, 12, 67]

Actuellement, je prévois de le faire comme ceci:

var newArray = [];
newArray.Push(response);

for (var i = 0; i < theArray.length; i++) {
    newArray.Push(theArray[i]);
}

theArray = newArray;
delete newArray;

Y a-t-il une meilleure façon de faire cela? Est-ce que Javascript a une fonctionnalité intégrée qui fait ça?

La complexité de ma méthode est O(n) et il serait vraiment intéressant de voir de meilleures implémentations.

javascriptarrays
1286
Moon

Utilisez unshift . C'est comme Push , sauf qu'il ajoute des éléments au début du tableau au lieu de la fin.

  • unshift/Push - ajoute un élément au début/à la fin d'un tableau
  • shift/pop - supprime et retourne le premier/dernier élément d'un tableau

Un schéma simple ...

   unshift -> array <- Push
   shift   <- array -> pop

et graphique:

          add  remove  start  end
   Push    X                   X
    pop           X            X
unshift    X             X
  shift           X      X

Consultez la documentation MDN Array . Pratiquement toutes les langues ayant la capacité de pousser/sauter des éléments d'un tableau auront également la possibilité de décaler/décaler des éléments (parfois appelés Push_front/pop_front), vous ne devriez jamais avoir à les implémenter vous-même.

2414
meagar

array operations image

var a = [23, 45, 12, 67];
a.unshift(34);
console.log(a); // [34, 23, 45, 12, 67]

1273
Maksym

Avec ES6, utilisez l'opérateur de propagation ...:

DEMO

var arr = [23, 45, 12, 67];
arr = [34, ...arr]; // RESULT : [34,23, 45, 12, 67]

console.log(arr)

171
Abdennour TOUMI

Une autre façon de faire cela à travers concat

var arr = [1, 2, 3, 4, 5, 6, 7];
console.log([0].concat(arr));

La différence entre concat et unshift est que concat renvoie un nouveau tableau. La performance entre eux pourrait être trouvée ici . 

function fn_unshift() {
  arr.unshift(0);
  return arr;
}

function fn_concat_init() {
  return [0].concat(arr)
}

Voici le résultat du test

 enter image description here

62
zangw

Quick Cheatsheet:  

Les termes shift/unshift et push/pop peuvent être un peu déroutants, du moins pour ceux qui ne connaissent peut-être pas la programmation en langage C.

Si vous ne connaissez pas le jargon, voici une traduction rapide de termes alternatifs, qu'il est peut-être plus facile de retenir:

* array_unshift()  -  (aka Prepend ;; InsertBefore ;; InsertAtBegin )     
* array_shift()    -  (aka UnPrepend ;; RemoveBefore  ;; RemoveFromBegin )

* array_Push()     -  (aka Append ;; InsertAfter   ;; InsertAtEnd )     
* array_pop()      -  (aka UnAppend ;; RemoveAfter   ;; RemoveFromEnd )
42
dreftymac

vous avez un tableau: var arr = [23, 45, 12, 67];

Pour ajouter un élément au début, vous voulez utiliser splice:

var arr = [23, 45, 12, 67];
arr.splice(0, 0, 34)
console.log(arr);

15
ozimax06

Push() ajoute un nouvel élément à la fin d'un tableau.
pop() supprime un élément de la fin d'un tableau.

unshift() ajoute un nouvel élément au début d'un tableau.
shift() supprime un élément du début d'un tableau.

utiliser theArray.unshift(response)

9
Harunur Rashid

var testdata = new Array();
testdata = [23, 45, 12, 67];
testdata = [34, ...testdata]; 
console.log(testdata)

5
Tirkesh Turkesh
var array = [23, 45, 12, 67];  
array.unshift(11);  
alert(array);
4
techdeepak

Sans mutate

En fait, tous les unshift/Push et shift/pop mutate le tableau Origin.

La unshift/Push ajoute un élément au tableau existant depuis le début/la fin et shift/pop supprime un élément du début/la fin d'un tableau.

Mais il existe un moyen d'ajouter des éléments à un tableau sans mutation. le résultat est un nouveau tableau, à ajouter à la fin du tableau, utilisez le code ci-dessous:

const originArray = ['one', 'two', 'three'];
const newItem = 4;
const newArray = originArray.concat(newItem);

Pour ajouter au début du tableau d'origine, utilisez le code ci-dessous:

const originArray = ['one', 'two', 'three'];
const newItem = 0;
const newArray = (originArray.reverse().concat(newItem)).reverse();

Avec la méthode ci-dessus, vous ajoutez au début/à la fin d'un tableau sans mutation.

3
AmerllicA

Si vous devez continuellement insérer un élément au début d'un tableau, il est plus rapide d'utiliser des instructions Push suivies d'un appel à reverse, au lieu d'appeler unshift tout le temps.

Test de référence:http://jsben.ch/kLIYf

3
Jenny O'Reilly

En utilisant splice, nous insérons un élément dans un tableau au début:

arrName.splice( 0, 0, 'newName1' );
0
Srikrushna Pal