Comment copier un objet en javascript

JavaScript est un langage de programmation puissant qui fournit de nombreuses méthodes pour manipuler des objets. En JavaScript, un objet fait référence à une structure de données composée de paires clé-valeur. Parfois, nous devons copier un objet au lieu de simplement le référencer. Dans cet article, nous aborderons les différentes manières de copier des objets en JavaScript.

Méthode 1 : Utilisez Object.assign()

Utilisez la méthode Object.assign() pour copier toutes les propriétés d'un ou plusieurs objets source vers l'objet cible. Cette méthode peut également être utilisée pour copier des objets.

Par exemple, nous avons un objet contenant des informations sur les employés :

let employee = {
    name: 'John Doe',
    age: 25,
    position: 'Developer'
};

Nous pouvons utiliser Object.assign() pour copier cet objet :

let newEmployee = Object.assign({}, employee);

Dans cet exemple, nous utilisons un objet vide comme objet cible et le passons comme premier paramètre. L'objet source (employé) est le deuxième paramètre. Lorsque nous exécutons ce code, un nouvel objet newEmployee sera créé contenant toutes les propriétés et valeurs de l'objet employé.

Si nous voulons copier plusieurs objets, nous pouvons les transmettre à la méthode Object.assign() dans l'ordre, comme indiqué ci-dessous :

let newEmployee = Object.assign({}, employee1, employee2, employee3);

Méthode 2 : Utiliser le spread opérateur

L'opérateur de propagation (...) a été introduit dans ES6, et peut être utilisé à différents endroits. Nous pouvons utiliser l’opérateur spread dans un tableau ou un objet pour répartir ses éléments. Utilisez l'opérateur spread dans un objet pour copier toutes les propriétés de l'objet source vers l'objet cible.

Par exemple, nous pouvons utiliser l'opérateur spread pour copier l'objet employé :

let newEmployee = { ...employee };

Dans cet exemple, nous utilisons toutes les propriétés développées à partir de l'objet employé pour créer un nouveau Objet newEmployee. Le "..." ici est la syntaxe de l'opérateur spread. Il extrait toutes les propriétés de l'objet employé et les ajoute au nouvel objet newEmployee. Ce nouvel objet est un objet totalement indépendant et non une référence à l'objet employé.

Méthode 3 : Utiliser JSON.parse() et JSON.stringify()

En JavaScript, nous pouvons également utiliser JSON.parse() et JSON.stringify() méthodes pour copier un objet. Nous pouvons convertir l'objet en chaîne JSON, puis analyser la chaîne en un nouvel objet.

Par exemple, nous avons un objet :

let employee = {
    name: 'John Doe',
    age: 25,
    position: 'Developer'
};

Nous pouvons utiliser les méthodes JSON.parse() et JSON.stringify() pour copier cet objet :

let newEmployee = JSON.parse(JSON.stringify(employee));

# 🎜🎜#La combinaison de ces deux méthodes peut être très utile pour copier des objets. Cependant, sachez qu'il ne peut pas copier des types de données spéciaux contenant des fonctions, des références d'objet ou qui ne peuvent pas être convertis en chaînes JSON.

Méthode 4 : Utilisez la méthode de copie approfondie

Si aucune des méthodes ci-dessus ne peut répondre à vos exigences, vous pouvez utiliser la méthode de copie approfondie. La méthode de copie complète copie l'intégralité de l'objet, y compris les références d'objet et les sous-objets. Il existe de nombreuses bibliothèques qui fournissent des méthodes de copie approfondie, telles que Lodash, Underscore.js, etc. Ici, nous allons présenter l'utilisation de la bibliothèque Lodash pour copier un objet.

Tout d'abord, vous devez installer la bibliothèque Lodash. Dans Node.js, vous pouvez utiliser la commande suivante pour installer :

npm install lodash

Dans le navigateur, vous pouvez utiliser le lien CDN suivant :

<script src="https://cdn.jsdelivr.net/lodash/4.17.15/lodash.min.js"></script>

Installation et importation de la bibliothèque Lodash Enfin, vous pouvez utiliser la méthode cloneDeep() pour créer une copie de l'objet original :

let newObject = _.cloneDeep(originalObject);

Dans cet exemple, la méthode cloneDeep() copiera complètement l'objet originalObject puis renverra le nouvel objet newObject .

Conclusion

Voici les différentes manières de copier des objets en JavaScript. Chaque méthode a ses avantages et ses inconvénients, selon vos besoins. Avant d’utiliser ces méthodes, il est important de comprendre le fonctionnement de chaque méthode et de déterminer celle qui convient le mieux à votre situation spécifique. Quelle que soit la méthode que vous choisissez, assurez-vous de bien comprendre quand vous copiez une référence d'objet et quand vous copiez l'objet lui-même.

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!