Cet article partage la copie superficielle et le code de copie profonde des objets JavaScript pour votre référence. Le contenu spécifique est le suivant
1. Copie légère
La copie signifie copier toutes les propriétés de l'objet parent à l'objet enfant.
La fonction suivante est la copie:
var chinois = {Nation: 'China'} var doctor = {carrière: 'docteur'} fonction extendCopy (p) {var c = {}; for (var i in p) {c [i] = p [i]; } c.uber = p; Retour C; }Lorsque vous l'utilisez, écrivez ceci:
var doctor = extendcopy (chinois); doctor.career = 'docteur'; alert (doctor.nation); // Chine
Cependant, il y a un problème avec une telle copie. Autrement dit, si la propriété de l'objet parent est égale à un tableau ou à un autre objet, alors en fait, l'objet enfant n'obtient qu'une adresse mémoire, pas une vraie copie, il est donc possible que l'objet parent soit falsifié.
Veuillez voir, maintenant ajouter une propriété "lieu de naissance" aux chinois, dont la valeur est un tableau.
Chinois.birthplaces = ['beijing', 'shanghai', 'hong kong'];
Grâce à la fonction ExtendCopy (), le médecin hérite du chinois.
var doctor = extendcopy (chinois);
Ensuite, nous ajoutons une ville au «lieu de naissance» du médecin:
Doctor.birthplaces.push ('Xiamen');
Découvrez les résultats d'entrée
alerte (doctor.birthplaces); // Pékin, Shanghai, Hong Kong, Xiamen
alerte (chinois. // Pékin, Shanghai, Hong Kong, Xiamen
En conséquence, les deux lieux de naissance ont été modifiés.
Par conséquent, ExtendCopy () copie simplement les données de type de base, et nous appelons cette copie "copie superficielle".
2. Copie profonde
Parce que la copie superficielle et profonde a de tels inconvénients, jetons un coup d'œil à la copie profonde ensuite
La soi-disant «copie profonde» signifie qu'elle peut réaliser la vraie copie des tableaux et des objets. Sa mise en œuvre n'est pas difficile, il suffit d'appeler «copie superficielle» récursivement.
fonction deepcopy (p, c) {var c = c || {}; for (var i in p) {if (typeof p [i] === 'objet') {c [i] = (p [i] .Contructor === array)? []: {}; Deepcopy (p [i], c [i]); } else {c [i] = p [i]; }} return c; }Jetez un œil à comment l'utiliser:
var doctor = Deepcopy (chinois);
Maintenant, ajoutez une propriété à l'objet parent avec la valeur en tant que tableau. Ensuite, modifiez cette propriété sur l'objet enfant:
Chinois.birthplaces = ['beijing', 'shanghai', 'hong kong']; doctor.birthplaces.push ('Xiamen'); alert (docteur.birthplaces); // Pékin, Shanghai, Hong Kong, alerte Xiamen (chinois. // Pékin, Shanghai, Hong KongCela complète la copie;
$ .Extend ()
$ .Extend () dans jQuery est le même.
$ .Extend ([Deep], Target, Object1 [, Objectn])
•profond
Type: booléen
Si c'est vrai, la fusion devient récursive (également appelée copie profonde).
•cible
Type: objet
Extension d'objet. Cela recevra de nouvelles propriétés.
• Object1
Type: objet
Un objet qui contient des propriétés supplémentaires fusionnées dans le premier paramètre.
• objet
Type: objet
Contient des attributs supplémentaires pour fusionner dans le premier paramètre
Lorsque nous fournissons deux objets ou plus sur $ .extend (), toutes les propriétés de l'objet sont ajoutées à l'objet cible (paramètre cible).
Si un seul paramètre est fourni à $ .extend (), cela signifie que le paramètre cible est omis. Dans ce cas, l'objet jQuery lui-même est par défaut vers l'objet cible. De cette façon, nous pouvons ajouter de nouvelles fonctionnalités sous l'espace de noms jQuery. Ceci est utile pour les développeurs de plugins lorsqu'ils souhaitent ajouter de nouvelles fonctions à jQuery.
N'oubliez pas que l'objet cible (premier paramètre) sera modifié et sera retourné via $ .Extend (). Cependant, si nous voulons garder l'objet d'origine, nous pouvons passer un objet vide comme objet cible:
var object = $ .extend ({}, object1, object2);
Par défaut, l'opération de fusion via $ .extend () n'est pas récursive; Si la propriété du premier objet lui-même est un objet ou un tableau, il remplacera complètement une propriété avec la même clé du deuxième objet. Ces valeurs ne seront pas fusionnées. Cela peut être compris en vérifiant la valeur de la banane dans l'exemple ci-dessous. Cependant, si True est utilisé comme premier argument de la fonction, des fusions récursives seront effectuées sur l'objet.
AVERTISSEMENT: Passer faux pour le premier paramètre n'est pas pris en charge.
1. Fusez deux objets et modifiez le premier objet.
var object1 = {Apple: 0, banane: {poids: 52, prix: 100}, cerise: 97}; var objet2 = {banane: {prix: 200}, durian: 100}; // fusionner object2 en objet1 $ .Extend (object1, objet2); // suppose JSON.Strinify - non disponible dans ie <8Console.Log (json.strify) dans ie <8Console.Log (json.strify (non disponible dans ie <8console.Log (json.strify (non disponible dans ie <8Console.Log (json.Strintify) ); // {"Apple": 0, "Banana": {"Price": 200}, "Cherry": 97, "Durian": 100}2. Fusez deux objets de manière récursive et modifiez le premier objet.
var object1 = {Apple: 0, banane: {poids: 52, prix: 100}, cerise: 97}; var objet2 = {banane: {prix: 200}, durian: 100}; // fusionner objet2 dans objet1, récursivement $ .Extend (true, object1. JSON.StRINGIFY (Object1)); // {"Apple": 0, "Banana": {"Weight": 52, "Price": 200}, "Cherry": 97, "durian": 100}3. Fusez les objets par défaut et options et ne modifiez pas l'objet par défaut. Il s'agit d'un modèle de développement de plug-in couramment utilisé.
var par défaut = {valider: false, limite: 5, nom: "foo"}; var options = {valider: true, name: "bar"}; // fusionner les défauts et les options, sans modifier les paramètres par défaut. )); console.log (json.stringify (paramètres)); // par défaut - {"valider": false, "limite": 5, "name": "foo"} // options - {"valider": true, "name": "bar"} // paramètres "}JavaScript détermine si les objets sont égaux
Dans JavaScript, les opérations d'égalité incluent "==", "===" cohérence. Il n'est pas nécessaire d'être la majorité des différences entre les deux. Dans cet article, nous expliquerons comment déterminer si deux objets sont égaux? Vous pourriez penser que si deux objets ont les mêmes propriétés et que leurs propriétés ont les mêmes valeurs, les deux objets sont égaux. Ensuite, utilisons un exemple pour démontrer:
var obj1 = {name: "benjamin", sexe: "mâle"} var obj2 = {name: "benjamin", sexe: "mâle"} // sort: false secondso.log (obj1 == obj2); // sorts: false seconde.log (obj1 === obj2);À partir de l'exemple ci-dessus, nous pouvons voir que si vous utilisez "==" ou "==", FALSE est renvoyé. La raison principale est que la chaîne et le nombre de types de base sont comparés par les valeurs, tandis que les objets (date, tableau) et les objets ordinaires sont comparés par l'adresse dans la mémoire pointée par les pointeurs. Voir l'exemple suivant:
var obj1 = {nom: "benjamin", sexe: "mâle"}; var obj2 = {nom: "benjamin", sexe: "mâle"}; var obj3 = obj1; // falseconsole.log (obj2 === Obj3); // sorties: falseconsole.log (obj2 === Obj3);L'exemple ci-dessus renvoie True car les pointeurs de Obj1 et OB3 pointent vers la même adresse en mémoire. Il est similaire au concept de passage de valeur et de référence dans les langues orientées objet (Java / C ++). Parce que, si vous souhaitez déterminer si deux objets sont égaux, vous devez être clair, essayez-vous de déterminer si les propriétés des deux objets sont les mêmes, ou si les valeurs correspondant aux propriétés sont les mêmes, ou quoi?
fonction personne (name) {this.name = name; } var p1 = nouvelle personne ("p1"); var p2 = nouvelle personne ("p2"); console.log (p1 == p2); // false personne.prototype.sayhi = fonction () {// Do Sayhi ici} console.log (p1.sayhi () == p2.sayhi ()); // true console.log (p1.sayhi () == p2.sayhi ()); // true console.log (p1.sayhi () === p2.sayhi ()); //vraiCe qui précède est tout le contenu de cet article. J'espère que cela sera utile à l'apprentissage de tous et j'espère que tout le monde soutiendra davantage Wulin.com.