Maison > interface Web > js tutoriel > le corps du texte

Comment fusionner efficacement deux tableaux d'objets JavaScript ?

Linda Hamilton
Libérer: 2024-11-15 09:09:02
original
191 Les gens l'ont consulté

How to Efficiently Merge Two JavaScript Arrays of Objects?

Merging Arrays of Objects in JavaScript

Suppose you have two arrays of objects:

var arr1 = [
  { name: "lang", value: "English" },
  { name: "age", value: "18" },
];

var arr2 = [
  { name: "childs", value: "5" },
  { name: "lang", value: "German" },
];
Copier après la connexion

You want to merge these arrays into a single array:

var arr3 = [
  { name: "lang", value: "German" },
  { name: "age", value: "18" },
  { name: "childs", value: "5" },
];
Copier après la connexion

jQuery's $.extend() Method

You may initially consider using $.extend(). However, it does not meet your requirements, as it simply updates the first array:

$.extend(arr1, arr2); // arr4 = [{name : "childs", value: '5'}, {name: "lang", value: "German"}]
Copier après la connexion

Using Array.prototype.push.apply()

A more effective way to merge the arrays is to use Array.prototype.push.apply():

Array.prototype.push.apply(arr1, arr2);
Copier après la connexion

This line of code essentially pushes the elements of arr2 onto the end of arr1. The result is a merged array stored in arr1.

// Example

var arr1 = [
  { name: "lang", value: "English" },
  { name: "age", value: "18" },
];

var arr2 = [
  { name: "childs", value: "5" },
  { name: "lang", value: "German" },
];

Array.prototype.push.apply(arr1, arr2);

console.log(arr1); // final merged result will be in arr1
Copier après la connexion

Output:

[
  { name: "lang", value: "English" },
  { name: "age", value: "18" },
  { name: "childs", value: "5" },
  { name: "lang", value: "German" },
]
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal