La méthode push()
ajoute un ou plusieurs éléments à la fin d'un tableau et retourne la nouvelle taille du tableau.
Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Si vous souhaitez contribuez à ces exemples, n'hésitez pas à cloner https://github.com/mdn/interactive-examples et à envoyer une pull request !
Syntaxe
arr.push(élément1, ..., élémentN)
Paramètres
élément1, ...,élémentN
- Les éléments à ajouter à la fin du tableau.
Valeur de retour
La nouvelle valeur de la propriété length
de l'objet sur lequel la méthode a été appelée.
Description
La méthode push
permet d'ajouter des valeurs à un tableau.
push
est une méthode générique. Cette méthode peut ainsi être utilisée avec les méthodes Function.call()
ou Function.apply()
sur des objets similaires aux tableaux.
La méthode push
se base sur la propriété length
pour déterminer à partir de quel index les valeurs données doivent être insérées. Si la propriété length
ne peut pas être convertie en nombre, l'index utilisé est 0. Si la propriété length
n'est pas définie, elle est alors créée.
Le seul objet natif ressemblant à un tableau est l'objet String
, mais la méthode push
y est difficilement applicable, car, en JavaScript, les chaînes de caractères sont immuables.
Exemples
Ajouter des éléments à un tableau
Le code suivant crée un tableau sports
contenant à sa création deux éléments, auxquels sont ajoutés deux nouveaux éléments. La variable total
contient la nouvelle taille du tableau.
var sports = ["plongée", "baseball"]; var total = sports.push("football", "tennis"); console.log(sports); // ["plongée", "baseball", "football", "tennis"] console.log(total); // 4
Fusionner deux tableaux
Dans l'exemple qui suit, on utilise la méthode Function.apply()
pour ajouter les différents éléments d'un second tableau
var légumes = ['navet', 'pomme de terre']; var autresLégumes = ['céleri', 'radis']; // On fusionne les deux tableaux // Équivalent à légumes.push('céleri', 'radis'); Array.prototype.push.apply(légumes, autresLégumes); console.log(légumes); // ['navet', 'pomme de terre', 'céleri', 'radis']
Note : Attention à ne pas utiliser cette méthode lorsque les tableaux sont très grands car une fonction n'accepte qu'un nombre limité d'arguments. Voir apply()
pour plus d'informations sur ces limites.
Utiliser un objet comme on utiliserait un tableau
Comme nous l'avons vu auparavant, push
est une méthode générique et nous pouvons donc utiliser Array.prototype.push
sur les objets. On notera qu'il n'est pas nécessaire de stocker un ensemble d'objets. En fait, on enregistre l'ensemble dans l'objet et on utilise call
sur Array.prototype.push
:
var obj = { length: 0, ajoutElem: function ajoutElem (elem) { // obj.length est automatiquement incrémenté // quand on ajoute un élément [].push.call(this, elem); } }; // Ajoutons quelques objets vides pour illustrer // l'exemple. obj.ajoutElem({}); obj.ajoutElem({}); console.log(obj.length); // → 2
Spécifications
Spécification | État | Commentaires |
---|---|---|
ECMAScript 3rd Edition (ECMA-262) | Standard | Définition initiale. Implémentée avec JavaScript 1.2. |
ECMAScript 5.1 (ECMA-262) La définition de 'Array.prototype.push' dans cette spécification. |
Standard | |
ECMAScript 2015 (6th Edition, ECMA-262) La définition de 'Array.prototype.push' dans cette spécification. |
Standard | |
ECMAScript Latest Draft (ECMA-262) La définition de 'Array.prototype.push' dans cette spécification. |
Projet |
Compatibilité des navigateurs
Fonctionnalité | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Support simple | 1 | Oui | 1 | 5.5 | Oui | Oui |
Fonctionnalité | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
---|---|---|---|---|---|---|---|
Support simple | Oui | Oui | Oui | 4 | Oui | Oui | Oui |