Creare un oggetto vuoto in JavaScript con {} o nuovo Object ()?

Question

Esistono due diversi modi per creare un oggetto vuoto in JavaScript:

var objectA = {}
var objectB = new Object()

C'è qualche differenza nel modo in cui il motore di script li gestisce? C'è qualche motivo per usarne uno rispetto all'altro?

Allo stesso modo è anche possibile creare un array vuoto usando una sintassi diversa:

var arrayA = []
var arrayB = new Array()

Answer 1

Oggetti

Non c'è alcun vantaggio nell'uso di new Object (); - mentre {}; può rendere il tuo codice più compatto e più leggibile.

Per definire oggetti vuoti sono tecnicamente uguali. La sintassi {} è più corta, più ordinata (meno Java-ish) e ti consente di popolare istantaneamente l'oggetto in linea - in questo modo:

var myObject = {
        title:  'Frog',
        url:    '/img/picture.jpg',
        width:  300,
        height: 200
      };

Array

Per gli array, allo stesso modo non c'è quasi alcun vantaggio nell'usare new Array (); su []; - con un'eccezione minore:

var emptyArray = new Array(100);

crea un array lungo 100 elementi con tutti gli slot contenenti undefined - che può essere utile / utile in determinate situazioni (come (new Array (9)). join ('Na -Na ') +' Batman! ').

La mia raccomandazione

1. Non usare mai new Object (); : è più clunk di "{}" e sembra sciocco.
2. Usa sempre []; - tranne quando devi creare rapidamente un " vuoto " array con una lunghezza predefinita.

Answer 2

Sì, c'è una differenza, non sono la stessa cosa. È vero che otterrai gli stessi risultati ma il motore funziona in modo diverso per entrambi. Uno di questi è un oggetto letterale e l'altro è un costruttore, due modi diversi di creare un oggetto in javascript.

var objectA = {} //This is an object literal

var objectB = new Object() //This is the object constructor

In JS tutto è un oggetto, ma con il nuovo Object () devi essere consapevole delle seguenti cose: Può ricevere un parametro e, a seconda di quel parametro, creerà una stringa, un numero o solo un vuoto oggetto.

Ad esempio: new Object (1) , restituirà un numero. new Object (" hello ") restituirà una stringa, ciò significa che il costruttore di oggetti può delegare, in base al parametro, la creazione dell'oggetto ad altri costruttori come stringa, numero, ecc ... È estremamente importante tenerlo presente quando si gestiscono dati dinamici per creare oggetti ..

Molti autori raccomandano di non usare il costruttore di oggetti quando è possibile utilizzare una certa notazione letterale, dove si sarà sicuri che ciò che si sta creando è ciò che ci si aspetta di avere nel proprio codice.

Ti suggerisco di fare un'ulteriore lettura sulle differenze tra notazione letterale e costruttori su javascript per trovare maggiori dettagli.

Answer 3

Questi hanno lo stesso risultato finale, ma aggiungerei semplicemente che l'uso della sintassi letterale può aiutare ad abituarsi alla sintassi di JSON (un sottoinsieme di sintassi JavaScript letterale di ifet), quindi potrebbe essere una buona pratica per entrare.

Un'altra cosa: potresti avere degli errori impercettibili se dimentichi di usare l'operatore new . Quindi, l'uso dei letterali ti aiuterà a evitare questo problema.

In definitiva, dipenderà dalla situazione e dalle preferenze.

Answer 4

La sintassi letterale di oggetto e matrice {} / [] è stata introdotta in JavaScript 1.2, quindi non è disponibile (e produrrà un errore di sintassi) nelle versioni di Netscape Navigator precedenti alla 4.0.

Le mie dita continuano a non dire nuovo Array (), ma sono un uomo molto anziano. Per fortuna Netscape 3 non è un browser che molte persone devono mai considerare oggi ...

Answer 5

var objectA = {}

è molto più veloce e, nella mia esperienza, più comunemente usato, quindi è probabilmente meglio adottare lo 'standard' e salvare un po 'di battitura.

Answer 6

Credo che {} sia stato raccomandato in uno dei video Javascript su qui come una buona convenzione di codifica. new è necessario per l'eredità pseudoclassica. il modo var obj = {}; aiuta a ricordare che questo non è un linguaggio orientato agli oggetti classico ma prototipo. Quindi l'unica volta che avresti davvero bisogno di new è quando stai usando le funzioni di costruzione. Ad esempio:

var Mammal = function (name) {
  this.name = name;
};

Mammal.prototype.get_name = function () {
  return this.name;
}

Mammal.prototype.says = function() {
  return this.saying || '';
}

Quindi viene utilizzato in questo modo:

var aMammal = new Mammal('Me warm-blooded');
var name = aMammal.get_name();

Un altro vantaggio dell'uso di {} rispetto a new Object è che puoi usarlo per eseguire letterali di oggetti in stile JSON.

Answer 7

Prestazioni di istanza di array

Se si desidera creare un array senza lunghezza:

var arr = []; è più veloce di var arr = new Array ();

Se si desidera creare un array vuoto con una certa lunghezza:

var arr = new Array (x); è più veloce di var arr = []; arr [x-1] = non definito ;

Per i benchmark fare clic su: https://jsfiddle.net/basickarl/ktbbry5b/

Non conosco tuttavia l'impronta di memoria di entrambi, posso immaginare che new Array () occupi più spazio.

Answer 8

Questa è essenzialmente la stessa cosa. Usa tutto ciò che ritieni più conveniente.

Answer 9

OK , ci sono solo 2 modi diversi per fare la stessa cosa! Uno chiamato oggetto letterale e l'altro è una funzione costruttore !

Ma continua a leggere, ci sono un paio di cose che vorrei condividere:

L'uso di {} rende il tuo codice più leggibile, creando istanze di Object o altre funzioni integrate non consigliate ...

Inoltre, la funzione Object ottiene parametri in quanto è una funzione, come Object (params) ... ma {} è un modo puro per avviare un oggetto in JavaScript .. .

L'uso di object letteral rende il codice molto più pulito e facile da leggere per altri sviluppatori ed è in linea con le migliori pratiche in JavaScript ...

Mentre Object in Javascript può essere praticamente qualsiasi cosa, {} punta solo ad oggetti javascript, per il test su come funziona, fai di seguito nel tuo codice javascript o console:

var n = new Object(1); //Number {[[PrimitiveValue]]: 1}

Sorprendentemente, sta creando un numero!

var a = new Object([1,2,3]); //[1, 2, 3]

E questo sta creando un array!

var s = new Object('alireza'); //String {0: "a", 1: "l", 2: "i", 3: "r", 4: "e", 5: "z", 6: "a", length: 7, [[PrimitiveValue]]: "alireza"}

e questo strano risultato per String !

Quindi, se stai creando un oggetto, si consiglia di usare letterale oggetto, per avere un codice standard ed evitare qualsiasi incidente di codice come sopra, anche la mia esperienza in termini di prestazioni usando {} è migliore nella mia esperienza!