Ein leeres Objekt in JavaScript mit {} oder new Object() erstellen?

Question

Es gibt zwei verschiedene Möglichkeiten zur Erstellung eines leeren Objekts in JavaScript:

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

Gibt es einen Unterschied in der Art und Weise, wie die Skript-Engine sie behandelt? Gibt es einen Grund, das eine dem anderen vorzuziehen?

In ähnlicher Weise ist es auch möglich, ein leeres Array mit einer anderen Syntax zu erstellen:

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

Answer 1

Objekte

Es gibt keinen Vorteil bei der Verwendung von new Object(); - während {}; kann Ihren Code kompakter und besser lesbar machen.

Für die Definition von leeren Objekten sind sie technisch gesehen dasselbe. Die {} Syntax ist kürzer, übersichtlicher (weniger Java-artig) und ermöglicht es Ihnen, das Objekt sofort inline zu füllen - etwa so:

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

Arrays

Für Arrays gibt es ebenfalls fast keinen Nutzen, wenn man jemals new Array(); en []; - mit einer kleinen Ausnahme:

var emptyArray = new Array(100);

erstellt ein 100 Elemente umfassendes Array mit allen Slots, die undefined - die in bestimmten Situationen nützlich sein können (z. B. (new Array(9)).join('Na-Na ') + 'Batman!' ).

Meine Empfehlung

1. Verwenden Sie niemals new Object(); - es ist schwerfälliger als {}; und sieht albern aus.
2. Verwenden Sie immer []; - außer wenn Sie schnell ein "leeres" Array mit einer vordefinierten Länge erstellen müssen.

Answer 2

Ja, es gibt einen Unterschied, sie sind nicht dasselbe. Es stimmt zwar, dass Sie die gleichen Ergebnisse erhalten, aber die Maschine arbeitet bei beiden auf unterschiedliche Weise. Einer von ihnen ist ein Objektliteral und der andere ist ein Konstruktor, zwei verschiedene Arten der Erstellung eines Objekts in Javascript.

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

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

In JS ist alles ein Objekt, aber Sie sollten sich der folgenden Sache mit new Object() bewusst sein: Es kann einen Parameter erhalten, und je nach diesem Parameter wird eine Zeichenkette, eine Zahl oder einfach ein leeres Objekt erstellt.

Zum Beispiel: new Object(1) wird eine Zahl zurückgegeben. new Object("hello") eine Zeichenkette zurückgibt, bedeutet dies, dass der Objektkonstruktor die Objekterzeugung - abhängig vom Parameter - an andere Konstruktoren wie Zeichenkette, Zahl, usw. delegieren kann. Es ist sehr wichtig, dies zu beachten, wenn Sie dynamische Daten verwalten, um Objekte zu erstellen...

Viele Autoren empfehlen, den Objektkonstruktor nicht zu verwenden, wenn Sie stattdessen eine bestimmte literale Notation verwenden können, bei der Sie sicher sein können, dass das, was Sie erzeugen, auch das ist, was Sie in Ihrem Code erwarten.

Ich schlage vor, dass Sie eine weitere Lektüre über die Unterschiede zwischen literaler Notation und Konstruktoren auf Javascript zu tun, um mehr Details zu finden.

Answer 3

Diese haben das gleiche Endergebnis, aber ich würde einfach hinzufügen, dass die Verwendung der literalen Syntax kann einem helfen, gewöhnen Sie sich an die Syntax von JSON (ein String-ified Teilmenge von JavaScript literalen Objektsyntax), so könnte es eine gute Praxis zu bekommen.

Und noch etwas: Es kann zu subtilen Fehlern kommen, wenn Sie vergessen, die new Betreiber. Durch die Verwendung von Literalen können Sie dieses Problem vermeiden.

Letztlich hängt es von der jeweiligen Situation und den Vorlieben ab.

Answer 4

var objectA = {}

ist viel schneller und wird meiner Erfahrung nach häufiger verwendet, so dass es wahrscheinlich am besten ist, den "Standard" zu übernehmen und etwas Tipparbeit zu sparen.

Answer 5

Leistung der Array-Instanziierung

Wenn Sie ein Array ohne Länge erstellen möchten:

var arr = []; ist schneller als var arr = new Array();

Wenn Sie ein leeres Array mit einer bestimmten Länge erstellen möchten:

var arr = new Array(x); ist schneller als var arr = []; arr[x-1] = undefined ;

Für Benchmarks klicken Sie bitte auf den folgenden Link: https://jsfiddle.net/basickarl/ktbbry5b/

Ich kenne jedoch nicht den Speicherbedarf der beiden, ich kann mir aber vorstellen, dass new Array() nimmt mehr Platz ein.