¿Cuál es la diferencia entre `nuevo Objeto()` y notación literal de objeto?
¿Cuál es la diferencia entre esta sintaxis basada en 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 notación literal de objeto.
¿Cuál es mejor y por qué?
No hay diferencia para un objeto simple sin métodos como en su ejemplo. Sin embargo, hay una gran diferencia cuando empiezas a agregar métodos a tu objeto.
Manera literal:
function Obj( prop ) {
return {
p : prop,
sayHello : function(){ alert(this.p); },
};
}
Forma de prototipo:
function Obj( prop ) {
this.p = prop;
}
Obj.prototype.sayHello = function(){alert(this.p);};
Ambas formas permiten la creación de instancias como Objesta:
var foo = new Obj( "hello" );
Sin embargo, con la forma literal, llevas una copia del sayHellométodo dentro de cada instancia de tus objetos. Mientras que, con la forma del prototipo, el método se define en el prototipo del objeto y se comparte entre todas las instancias del objeto.
Si tiene muchos objetos o muchos métodos, la forma literal puede generar un desperdicio de memoria bastante grande.
Ambos hacen lo mismo (a menos que alguien haya hecho algo inusual), aparte de 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 lo que está sucediendo, por lo que al usar new Object(), en realidad solo estás escribiendo más y (en teoría, si el motor JavaScript no lo optimiza) realizando una llamada de función innecesaria.
Estos
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 hago lo mismo. El primero simplemente crea un objeto. El segundo crea uno y le asigna una propiedad. Para que el primero sea igual, necesita un segundo paso para crear y asignar la propiedad.
Lo "algo inusual" que alguien podría hacer sería seguir o asignar al Objectvalor global predeterminado:
// Don't do this
Object = 23;
En ese caso tan inusual , new Objectfallará pero {}funcionará.
En la práctica, nunca hay una razón para usar new Objecten lugar de {}(a menos que hayas hecho algo muy inusual).
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 exista una diferencia significativa entre estos dos con respecto a cómo operan detrás de escena (corríjame si me equivoco; me encantaría saberlo). Sin embargo, el segundo método (usar la notación literal de objeto) ofrece algunas ventajas.
- Es más corto (10 caracteres para ser precisos)
- Es más fácil y estructurado crear objetos sobre la marcha.
- No importa si algún bufón ha anulado inadvertidamente el objeto
Considere un nuevo objeto que contiene los miembros Nombre y TelNo. Usando la nueva convención Object(), podemos crearlo así:
var obj1 = new Object();
obj1.Name = "A Person";
obj1.TelNo = "12345";
La función Expando Properties de JavaScript nos permite crear nuevos miembros de esta manera sobre la marcha y logramos lo que pretendíamos. Sin embargo, esta forma no está muy estructurada ni encapsulada. ¿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 la asignación posterior a la creación?
Aquí es donde la notación literal de objeto puede ayudar:
var obj1 = {Name:"A Person",TelNo="12345"};
Aquí hemos logrado el mismo efecto en una línea de código y con muchos menos caracteres.
Puede encontrar más información sobre los métodos de construcción de objetos anteriores en: JavaScript y programación orientada a objetos (OOP).
Y finalmente, ¿qué pasa con el idiota que anuló a Object? ¿Creías que no era posible? Bueno, este JSFiddle demuestra lo contrario. El uso de la notación literal de 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
claramente {} y [] son más rápidos que usar new para crear objetos/matrices vacías.
Todo el mundo aquí habla de las similitudes de los dos. Voy a señalar las diferencias.
El uso
new Object()le permite pasar otro objeto. El resultado obvio es que el objeto recién creado se establecerá con la misma referencia. Aquí hay un código de muestra:var obj1 = new Object(); obj1.a = 1; var obj2 = new Object(obj1); obj2.a // 1El uso no se limita a objetos como en los objetos OOP. También se le podrían pasar otros tipos. La función establecerá el tipo en consecuencia. Por ejemplo, si le pasamos el número entero 1, se creará para nosotros un objeto de tipo número.
var obj = new Object(1); typeof obj // "number"El objeto creado utilizando el método anterior (
new Object(1)) se convertiría al 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
