J'ai un tableau JavaScript dataArray
que je veux pousser dans un nouveau tableau newArray
. Sauf que je ne veux pas que newArray[0]
soit dataArray
. Je veux pousser tous les éléments dans le nouveau tableau:
var newArray = [];
newArray.pushValues(dataArray1);
newArray.pushValues(dataArray2);
// ...
ou même mieux:
var newArray = new Array (
dataArray1.values(),
dataArray2.values(),
// ... where values() (or something equivalent) would Push the individual values into the array, rather than the array itself
);
Alors maintenant, le nouveau tableau contient toutes les valeurs des tableaux de données individuels. Existe-t-il des raccourcis tels que pushValues
, de sorte que je n'ai pas à parcourir chaque individu dataArray
, en ajoutant les éléments un par un?
Utilisez la fonction concat , comme suit:
var arrayA = [1, 2];
var arrayB = [3, 4];
var newArray = arrayA.concat(arrayB);
La valeur de newArray
sera [1, 2, 3, 4]
(arrayA
et arrayB
restent inchangés; concat
crée et renvoie un nouveau tableau pour le résultat).
Si vos tableaux ne sont pas énormes (voir l'avertissement ci-dessous), vous pouvez utiliser la méthode Push()
du tableau auquel vous souhaitez ajouter des valeurs. Push()
peut prendre plusieurs paramètres afin que vous puissiez utiliser sa méthode apply()
pour transmettre le tableau de valeurs à pousser en tant que liste de paramètres de fonction. Cela présente l'avantage par rapport à l'utilisation de concat()
d'ajouter des éléments au tableau en place plutôt que de créer un nouveau tableau.
Cependant, il semble que pour les grands tableaux (de l’ordre de 100 000 membres ou plus), cette astuce puisse échouer. Pour de tels tableaux, l’utilisation d’une boucle est une meilleure approche. Voir https://stackoverflow.com/a/17368101/96100 pour plus de détails.
var newArray = [];
newArray.Push.apply(newArray, dataArray1);
newArray.Push.apply(newArray, dataArray2);
Vous voudrez peut-être généraliser ceci dans une fonction:
function pushArray(arr, arr2) {
arr.Push.apply(arr, arr2);
}
... ou l'ajouter au prototype de Array
:
Array.prototype.pushArray = function(arr) {
this.Push.apply(this, arr);
};
var newArray = [];
newArray.pushArray(dataArray1);
newArray.pushArray(dataArray2);
... ou émulez la méthode Push()
d'origine en autorisant plusieurs paramètres en utilisant le fait que concat()
, comme Push()
, autorise plusieurs paramètres:
Array.prototype.pushArray = function() {
this.Push.apply(this, this.concat.apply([], arguments));
};
var newArray = [];
newArray.pushArray(dataArray1, dataArray2);
Voici une version en boucle du dernier exemple, adaptée aux grands tableaux et à tous les principaux navigateurs, y compris IE <= 8:
Array.prototype.pushArray = function() {
var toPush = this.concat.apply([], arguments);
for (var i = 0, len = toPush.length; i < len; ++i) {
this.Push(toPush[i]);
}
};
J'ajouterai une réponse "pérenne"
Dans ECMAScript 6, vous pouvez utiliser l'opérateur spread :
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.Push(...arr2);
L'opérateur Spread n'est pas encore inclus dans tous les principaux navigateurs. Pour la compatibilité actuelle, voir ce tableau de compatibilité (mis à jour en permanence).
Vous pouvez cependant utiliser l'opérateur spread avec Babel.js .
modifier:
Voir la réponse de Jack Giffin ci-dessous pour plus de commentaires sur les performances. Il semble que le concat est toujours meilleur et plus rapide que l’opérateur de spread.
Trouvé un moyen élégant de MDN
var vegetables = ['parsnip', 'potato'];
var moreVegs = ['celery', 'beetroot'];
// Merge the second array into the first one
// Equivalent to vegetables.Push('celery', 'beetroot');
Array.prototype.Push.apply(vegetables, moreVegs);
console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']
Ou vous pouvez utiliser la fonctionnalité spread operator
de ES6:
let fruits = [ 'Apple', 'banana'];
const moreFruits = [ 'orange', 'Plum' ];
fruits.Push(...moreFruits); // ["Apple", "banana", "orange", "Plum"]
var a=new Array('a','b','c');
var b=new Array('d','e','f');
var d=new Array('x','y','z');
var c=a.concat(b,d)
Cela résout-il votre problème?
Ce qui suit me semble le plus simple:
var newArray = dataArray1.slice();
newArray.Push.apply(newArray, dataArray2);
Comme "Push" prend un nombre variable d'arguments, vous pouvez utiliser la méthode apply
de la fonction Push
pour pousser tous les éléments d'un autre tableau. Il construit Un appel à Push en utilisant son premier argument ("newArray" ici) en tant que "this" et les éléments Du tableau en tant qu'arguments restants.
La slice
dans la première instruction obtient une copie du premier tableau, de sorte que vous ne le modifiez pas.
Mise à jour Si vous utilisez une version de javascript avec une tranche disponible, vous pouvez simplifier l'expression Push
en:
newArray.Push(...dataArray2)
Un certain nombre de réponses parlent de Array.prototype.Push.apply . Voici un exemple clair:
var dataArray1 = [1, 2];
var dataArray2 = [3, 4, 5];
var newArray = [ ];
Array.prototype.Push.apply(newArray, dataArray1); // newArray = [1, 2]
Array.prototype.Push.apply(newArray, dataArray2); // newArray = [1, 2, 3, 4, 5]
console.log(JSON.stringify(newArray)); // Outputs: [1, 2, 3, 4, 5]
Si vous avez la syntaxe ES6:
var dataArray1 = [1, 2];
var dataArray2 = [3, 4, 5];
var newArray = [ ];
newArray.Push(...dataArray1); // newArray = [1, 2]
newArray.Push(...dataArray2); // newArray = [1, 2, 3, 4, 5]
console.log(JSON.stringify(newArray)); // Outputs: [1, 2, 3, 4, 5]
Avec JavaScript ES6, vous pouvez utiliser l'opérateur ... en tant qu'opérateur de propagation, qui convertira essentiellement le tableau en valeurs. Ensuite, vous pouvez faire quelque chose comme ceci:
const myArray = [1,2,3,4,5];
const moreData = [6,7,8,9,10];
const newArray = [
...myArray,
...moreData,
];
Bien que la syntaxe soit concise, j'ignore comment cela fonctionne en interne et quelles sont les implications en termes de performances pour les tableaux de grande taille.
La fonction ci-dessous n'a pas de problème avec la longueur des tableaux et fonctionne mieux que toutes les solutions suggérées:
function pushArray(list, other) {
var len = other.length;
var start = list.length;
list.length = start + len;
for (var i = 0; i < len; i++ , start++) {
list[start] = other[i];
}
}
malheureusement, jspref refuse d'accepter mes soumissions, alors voici les résultats en utilisant benchmark.js
Name | ops/sec | ± % | runs sampled
for loop and Push | 177506 | 0.92 | 63
Push Apply | 234280 | 0.77 | 66
spread operator | 259725 | 0.40 | 67
set length and for loop | 284223 | 0.41 | 66
où
for loop et Push est:
for (var i = 0, l = source.length; i < l; i++) {
target.Push(source[i]);
}
Push Apply:
target.Push.apply(target, source);
opérateur de propagation:
target.Push(...source);
et enfin la "longueur définie et pour la boucle" est la fonction ci-dessus
Voici la manière ES6
var newArray = [];
let dataArray1 = [1,2,3,4]
let dataArray2 = [5,6,7,8]
newArray = [...dataArray1, ...dataArray2]
console.log(newArray)
La méthode ci-dessus est bonne pour la plupart des cas, et s'il ne s'agit pas de cas, veuillez considérer
concat
, comme si vous aviez cent milliers d'éléments dans des tableaux.
let dataArray1 = [1,2,3,4]
let dataArray2 = [5,6,7,8]
let newArray = dataArray1.concat(dataArray2);
console.log(newArray)
Nous avons deux tableaux a et b. le code que fait ici est tableau une valeur est poussée dans tableau b.
let a = [2, 4, 6, 8, 9, 15]
function transform(a) {
let b = ['4', '16', '64']
a.forEach(function(e) {
b.Push(e.toString());
});
return b;
}
transform(a)
[ '4', '16', '64', '2', '4', '6', '8', '9', '15' ]
Si vous souhaitez modifier le tableau d'origine, vous pouvez étendre et pousser:
var source = [1, 2, 3];
var range = [5, 6, 7];
var length = source.Push(...range);
console.log(source); // [ 1, 2, 3, 5, 6, 7 ]
console.log(length); // 6
Si vous voulez vous assurer que seuls les éléments du même type figurent dans le tableau source
(sans mélanger les nombres et les chaînes par exemple), utilisez TypeScript.
/**
* Adds the items of the specified range array to the end of the source array.
* Use this function to make sure only items of the same type go in the source array.
*/
function addRange<T>(source: T[], range: T[]) {
source.Push(...range);
}