metodos - recorrer array de objetos javascript
¿Cuál es la diferencia entre `new Object()` y la notación literal del objeto? (9)
Además, de acuerdo con algunos de los libros de O''Really javascript .... (citado)
Otra razón para usar literales en comparación con el constructor de objetos es que no hay resolución de alcance. Debido a que es posible que haya creado un constructor local con el mismo nombre, el intérprete necesita buscar la cadena de alcance desde el lugar al que está llamando Objeto () hasta que encuentre el constructor de Objetos global.
¿Cuál es la diferencia entre esta sintaxis basada en el constructor para crear un objeto?
person = new Object()
... y esta sintaxis literal:
person = {
property1 : "Hello"
};
Parece que ambos hacen lo mismo, aunque JSLint prefiere que uses la notación literal del objeto.
¿Cuál es mejor y por qué?
Ambos hacen lo mismo (a menos que alguien haya hecho algo inusual), salvo que el segundo crea un objeto y le agrega una propiedad. Pero la notación literal ocupa menos espacio en el código fuente. Es claramente reconocible en cuanto a lo que está sucediendo, por lo que si usa new Object()
, simplemente está escribiendo más y (en teoría, si no está optimizado por el motor de JavaScript) realizando una llamada de función innecesaria.
Estas
person = new Object() /*You should put a semicolon here too.
It''s not required, but it is good practice.*/
-or-
person = {
property1 : "Hello"
};
técnicamente no hagas lo mismo. El primero solo crea un objeto. El segundo crea uno y le asigna una propiedad. Para que el primero sea el mismo, necesita un segundo paso para crear y asignar la propiedad.
El "algo inusual" que alguien podría hacer sería sombrear o asignar al Object
global predeterminado:
// Don''t do this
Object = 23;
En ese caso altamente inusual , el new Object
fallará pero {}
funcionará.
En la práctica, nunca hay una razón para usar new Object
lugar de {}
(a menos que haya hecho algo muy inusual).
El uso de memoria es diferente si crea 10 mil instancias. new Object()
solo conservará una copia, mientras que {}
guardará 10 mil copias.
En JavaScript, podemos declarar un nuevo objeto vacío de dos maneras:
var obj1 = new Object();
var obj2 = {};
No he encontrado nada que sugiera que haya una diferencia significativa entre estos dos con respecto a cómo operan detrás de escena (corríjanme si me equivoco, me encantaría saber). Sin embargo, el segundo método (usando la notación literal del objeto) ofrece algunas ventajas.
- Es más corto (10 caracteres para ser precisos)
- Es más fácil y más estructurado para crear objetos sobre la marcha
- No importa si un bufón ha anulado inadvertidamente el objeto
Considere un nuevo objeto que contiene los miembros Name y TelNo. Usando la nueva convención Object (), podemos crearlo así:
var obj1 = new Object();
obj1.Name = "A Person";
obj1.TelNo = "12345";
La característica de Expando Properties de JavaScript nos permite crear nuevos miembros de esta manera sobre la marcha, y logramos lo que pretendíamos. Sin embargo, de esta manera no es muy estructurado o encapsulado. ¿Qué pasaría si quisiéramos especificar los miembros al momento de la creación, sin tener que depender de las propiedades de expansión y de la post-creación de las asignaciones?
Aquí es donde la notación literal del objeto puede ayudar:
var obj1 = {Name:"A Person",TelNo="12345"};
Aquí hemos logrado el mismo efecto en una línea de código y significativamente menos caracteres.
Una discusión adicional sobre los métodos de construcción de objetos se puede encontrar en: JavaScript y Programación Orientada a Objetos (OOP).
Y finalmente, ¿qué pasa con el idiota que anuló a Object? ¿Pensaste que no era posible? Bueno, este JSFiddle demuestra lo contrario. Usar la notación literal del objeto evita que caigamos en esta bufonada.
(De http://www.jameswiseman.com/blog/2011/01/19/jslint-messages-use-the-object-literal-notation/ )
En mi máquina usando Node.js, ejecuté lo siguiente:
console.log(''Testing Array:'');
console.time(''using[]'');
for(var i=0; i<200000000; i++){var arr = []};
console.timeEnd(''using[]'');
console.time(''using new'');
for(var i=0; i<200000000; i++){var arr = new Array};
console.timeEnd(''using new'');
console.log(''Testing Object:'');
console.time(''using{}'');
for(var i=0; i<200000000; i++){var obj = {}};
console.timeEnd(''using{}'');
console.time(''using new'');
for(var i=0; i<200000000; i++){var obj = new Object};
console.timeEnd(''using new'');
Tenga en cuenta que esta es una extensión de lo que se encuentra aquí: ¿Por qué arr = [] es más rápido que arr = new Array?
mi salida fue la siguiente:
Testing Array:
using[]: 1091ms
using new: 2286ms
Testing Object:
using{}: 870ms
using new: 5637ms
tan claramente {} y [] son más rápidos que usar new para crear objetos / matrices vacíos.
En realidad, hay varias formas de crear objetos en JavaScript. Cuando solo quiere crear un objeto, no hay beneficio de crear objetos " basados en constructor " usando el operador " nuevo ". Es lo mismo que crear un objeto utilizando la sintaxis de " objeto literal ". Pero los objetos " constructor-based " creados con el operador " nuevo " tienen un uso increíble cuando piensas en " herencia prototípica ". No puede mantener la cadena de herencia con objetos creados con sintaxis literal. Pero puede crear una función de constructor , adjuntar propiedades y métodos a su prototipo. Entonces, si asigna esta función de constructor a cualquier variable usando el operador " nuevo ", devolverá un objeto que tendrá acceso a todos los métodos y propiedades asociados con el prototipo de esa función de constructor.
Aquí hay un ejemplo de cómo crear un objeto usando la función de constructor (vea la explicación del código en la parte inferior):
function Person(firstname, lastname) {
this.firstname = firstname;
this.lastname = lastname;
}
Person.prototype.fullname = function() {
console.log(this.firstname + '' '' + this.lastname);
}
var zubaer = new Person(''Zubaer'', ''Ahammed'');
var john = new Person(''John'', ''Doe'');
zubaer.fullname();
john.fullname();
Ahora puede crear tantos objetos como desee creando una instancia de la función de construcción de la persona y todos heredarán fullname () de ella.
Nota: " esta " palabra clave se referirá a un objeto vacío dentro de una función constructora y cada vez que cree un nuevo objeto desde Persona utilizando el " nuevo " operador devolverá automáticamente un objeto que contiene todas las propiedades y métodos asociados con la palabra clave " this " . Y estos objetos seguramente heredarán los métodos y propiedades asociados con el prototipo de la función de constructor de persona (que es la principal ventaja de este enfoque).
Por cierto, si quisieras obtener la misma funcionalidad con la sintaxis " object literal ", deberías crear fullname () en todos los objetos como a continuación:
var zubaer = {
firstname: ''Zubaer'',
lastname: ''Ahammed'',
fullname: function() {
console.log(this.firstname + '' '' + this.lastname);
}
};
var john= {
firstname: ''John'',
lastname: ''Doe'',
fullname: function() {
console.log(this.firstname + '' '' + this.lastname);
}
};
zubaer.fullname();
john.fullname();
Por último, si ahora pregunta por qué debería usar el enfoque de la función constructora en lugar del enfoque literal del objeto :
*** La herencia prototípica permite una cadena simple de herencia que puede ser inmensamente útil y poderosa.
*** Ahorra memoria al heredar los métodos y propiedades comunes definidos en el prototipo de funciones del constructor. De lo contrario, tendría que copiarlos una y otra vez en todos los objetos.
Espero que esto tenga sentido.
He encontrado una diferencia, para ES6 / ES2015. No puede devolver un objeto utilizando la sintaxis de la función de flecha abreviada, a menos que rodee el objeto con un new Object()
.
> [1, 2, 3].map(v => {n: v});
[ undefined, undefined, undefined ]
> [1, 2, 3].map(v => new Object({n: v}));
[ { n: 1 }, { n: 2 }, { n: 3 } ]
Esto se debe a que el compilador está confundido por los {}
corchetes y piensa que n: i
es una etiqueta: construcción de enunciados ; el punto y coma es opcional, por lo que no se queja.
Si agrega otra propiedad al objeto, finalmente arrojará un error.
$ node -e "[1, 2, 3].map(v => {n: v, m: v+1});"
[1, 2, 3].map(v => {n: v, m: v+1});
^
SyntaxError: Unexpected token :
No hay diferencia para un objeto simple sin métodos como en su ejemplo. Sin embargo, hay una gran diferencia cuando comienzas a agregar métodos a tu objeto.
Manera literal:
function Obj( prop ) {
return {
p : prop,
sayHello : function(){ alert(this.p); },
};
}
Forma prototipo:
function Obj( prop ) {
this.p = prop;
}
Obj.prototype.sayHello = function(){alert(this.p);};
Ambas formas permiten la creación de instancias de Obj
como esta:
var foo = new Obj( "hello" );
Sin embargo, con la forma literal, llevas una copia del método sayHello
dentro de cada instancia de tus objetos. Mientras que, con la forma de prototipo, el método se define en el prototipo del objeto y se comparte entre todas las instancias de objetos. Si tiene muchos objetos o muchos métodos, la forma literal puede conducir a un desperdicio de memoria bastante grande.
Todos aquí están hablando de las similitudes de los dos. Voy a señalar las diferencias.
El uso de
new Object()
permite pasar otro objeto. El resultado obvio es que el objeto recién creado se establecerá en la misma referencia. Aquí hay un código de muestra:var obj1 = new Object(); obj1.a = 1; var obj2 = new Object(obj1); obj2.a // 1
El uso no está limitado a objetos como en objetos OOP. Otros tipos podrían pasarse a él también. La función configurará el tipo en consecuencia. Por ejemplo, si pasamos el número entero 1, se creará un objeto de tipo número para nosotros.
var obj = new Object(1); typeof obj // "number"
El objeto creado utilizando el método anterior (
new Object(1)
) se convertiría a tipo de objeto si se le agrega una propiedad.var obj = new Object(1); typeof obj // "number" obj.a = 2; typeof obj // "object"
Si el objeto es una copia de una clase secundaria de objeto, podríamos agregar la propiedad sin la conversión de tipo.
var obj = new Object("foo"); typeof obj // "object" obj === "foo" // true obj.a = 1; obj === "foo" // true obj.a // 1 var str = "foo"; str.a = 1; str.a // undefined