Este artículo comparte la copia superficial y el código de copia profunda de los objetos JavaScript para su referencia. El contenido específico es el siguiente
1. Copia ligera
Copia significa copiar todas las propiedades del objeto principal al objeto infantil.
La siguiente función es copiar:
var chino = {nación: 'China'} var doctor = {carrera: 'doctor'} función extendCopy (p) {var c = {}; para (var i en p) {c [i] = p [i]; } c.uber = p; regreso c; }Al usarlo, escriba esto:
Var Doctor = ExtendCopy (chino); doctor.career = 'doctor'; alerta (doctor.nation); // Porcelana
Sin embargo, hay un problema con dicha copia. Es decir, si la propiedad del objeto principal es igual a una matriz u otro objeto, entonces, de hecho, el objeto infantil solo obtiene una dirección de memoria, no una copia real, por lo que existe la posibilidad de que el objeto principal sea manipulado.
Consulte, ahora agregue una propiedad de "lugar de nacimiento" al chino, cuyo valor es una matriz.
Chino.birthplaces = ['Beijing', 'Shanghai', 'Hong Kong'];
A través de la función ExtendCopy (), el médico hereda el chino.
Var Doctor = ExtendCopy (chino);
Luego agregamos una ciudad al "lugar de nacimiento" del médico:
Doctor.birthplaces.push ('xiamen');
Consulte los resultados de la entrada
alerta (doctor.birthplaces); // Beijing, Shanghai, Hong Kong, Xiamen
alerta (chino.birthplaces); // Beijing, Shanghai, Hong Kong, Xiamen
Como resultado, ambos lugares de nacimiento fueron cambiados.
Por lo tanto, ExtendCopy () simplemente copia los datos de tipo básico, y llamamos a esta copia "copia superficial".
2. Copia profunda
Debido a que la copia superficial y profunda tiene tales desventajas, echemos un vistazo a la copia profunda a continuación
La llamada "copia profunda" significa que puede realizar la copia real de matrices y objetos. Su implementación no es difícil, solo llame a "copia superficial" de manera recursiva.
Función DeepCopy (P, C) {var c = c || {}; for (var i en p) {if (typeof p [i] === 'object') {c [i] = (p [i] .constructor === Array)? []: {}; Deepcopy (P [i], c [i]); } else {c [i] = p [i]; }} return c; }Eche un vistazo a cómo usarlo:
Var Doctor = DeepCopy (chino);
Ahora, agregue una propiedad al objeto principal con el valor como una matriz. Luego, modifique esta propiedad en el objeto infantil:
Chino.birthplaces = ['beijing', 'shanghai', 'hong kong']; doctor.birthplaces.push ('xiamen'); alerta (doctor.birthplaces); // Beijing, Shanghai, Hong Kong, Xiamen Alert (chino.birthplaces); // Beijing, Shanghai, Hong KongEsto completa la copia;
$ .extend ()
$ .extend () en jQuery es el mismo.
$ .extend ([profundo], Target, Object1 [, Objectn])
•profundo
Tipo: booleano
Si es cierto, la fusión se vuelve recursiva (también llamada copia profunda).
•objetivo
Tipo: Objeto
Extensión del objeto. Esto recibirá nuevas propiedades.
• Object1
Tipo: Objeto
Un objeto que contiene propiedades adicionales fusionadas en el primer parámetro.
• Objectn
Tipo: Objeto
Contiene atributos adicionales para fusionarse con el primer parámetro
Cuando proporcionamos dos o más objetos a $ .extend (), todas las propiedades del objeto se agregan al objeto de destino (parámetro de destino).
Si solo se proporciona un parámetro a $ .extend (), esto significa que se omite el parámetro objetivo. En este caso, el objeto jQuery en sí mismo está predeterminado al objeto de destino. De esta manera, podemos agregar nuevas funciones en el espacio de nombres jQuery. Esto es útil para los desarrolladores de complementos cuando desean agregar nuevas funciones a JQuery.
Recuerde que el objeto de destino (primer parámetro) se modificará y se devolverá a través de $ .extend (). Sin embargo, si queremos mantener el objeto original, podemos pasar un objeto vacío como objeto objetivo:
var objeto = $ .extend ({}, objeto1, objeto2);
Por defecto, la operación de fusión a través de $ .extend () no es recursiva; Si la propiedad del primer objeto en sí es un objeto o matriz, anulará una propiedad completamente con la misma clave del segundo objeto. Estos valores no se fusionarán. Esto puede entenderse verificando el valor del plátano en el ejemplo a continuación. Sin embargo, si True se usa como el primer argumento de la función, las fusiones recursivas se realizarán en el objeto.
ADVERTENCIA: Pasar falso para el primer parámetro no es compatible.
1. Fusionar dos objetos y modificar el primer objeto.
var object1 = {Apple: 0, Banana: {peso: 52, precio: 100}, cereza: 97}; var object2 = {banana: {precio: 200}, durian: 100}; // fusionar object2 en object1 $. ); // {"Apple": 0, "Banana": {"Price": 200}, "Cherry": 97, "Durian": 100}2. Fusionar dos objetos de manera recursiva y modificar el primer objeto.
var object1 = {Apple: 0, Banana: {peso: 52, precio: 100}, cereza: 97}; var object2 = {banana: {precio: 200}, durian: 100}; // fusionar object2 en object1, recursivamente $ .extend (true, objeto1, objeto2); // suponiendo json.stringify - no disponible en ie <8console.LoG ((ojú, objeto1, objeto2); // suponiendo json.stringify - no disponible en ie <8console.LoG ((n. Json.stringify (object1)); // {"Apple": 0, "Banana": {"peso": 52, "precio": 200}, "cereza": 97, "durian": 100}3. Fusione los objetos predeterminados y de opciones y no modifique el objeto predeterminado. Este es un modelo de desarrollo de complementos comúnmente utilizado.
var defaults = {validate: false, límite: 5, nombre: "foo"}; var options = {validate: true, name: "bar"}; // fusionar predeterminados y opciones, sin modificar la configuración de defaultsvar = $ .extend ({}, defaults, opciones); console.log (json.stingify (predeterminado); )); console.log (json.stringify (configuración)); // defaults - {"validate": falso, "límite": 5, "nombre": "foo"} // opciones - {"validato": true, "nombre": "bar"JavaScript determina si los objetos son iguales
En JavaScript, las operaciones de igualdad incluyen la consistencia "==", "===". No es necesario ser la mayoría de las diferencias entre los dos. En este artículo, hablaremos sobre cómo determinar si dos objetos son iguales. Puede pensar que si dos objetos tienen las mismas propiedades y sus propiedades tienen los mismos valores, entonces los dos objetos son iguales. Entonces usemos un ejemplo para demostrar:
var obj1 = {nombre: "benjamin", sexo: "masculino"} var obj2 = {nombre: "benjamin", sexo: "masculino"} // salidas: false segundo.log (obj1 == obj2); // salidas: falso segundo.log (obj1 === obj2);Del ejemplo anterior, podemos ver que si usa "==" o "==", se devuelve el falso. La razón principal es que la cadena y el número de tipos básicos se comparan con los valores, mientras que los objetos (fecha, matriz) y los objetos ordinarios se comparan mediante la dirección en la memoria señalada por punteros. Vea el siguiente ejemplo:
var obj1 = {nombre: "benjamin", sexo: "masculino"}; var obj2 = {name: "benjamin", sexo: "masculino"}; var obj3 = obj1; // salidas: trueConsole.log (obj1 == obj3); // salidas: trueconsole.log (obj1 ======== OBJ3); Falseconsole.log (obj2 === obj3); // salidas: Falseconsole.log (obj2 === obj3);El ejemplo anterior devuelve verdadero porque los punteros de OBJ1 y OB3 apuntan a la misma dirección en la memoria. Es similar al concepto de paso de valor y el paso de referencia en idiomas orientados a objetos (Java/C ++). Porque, si desea determinar si dos objetos son iguales, debe estar claro, ¿está tratando de determinar si las propiedades de los dos objetos son iguales o si los valores correspondientes a las propiedades son iguales o qué?
Función Persona (nombre) {this.name = name; } var p1 = nueva persona ("p1"); var p2 = nueva persona ("p2"); console.log (p1 == P2); // false persona.prototype.sayhi = function () {// do sayhi aquí} console.log (p1.sayhi () == p2.sayhi ()); // verdadero console.log (p1.sayhi () == p2.sayhi ()); // verdadero console.log (p1.sayhi () === p2.sayhi ()); //verdaderoLo anterior es todo el contenido de este artículo. Espero que sea útil para el aprendizaje de todos y espero que todos apoyen más a Wulin.com.