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

Es gibt zwei verschiedene Möglichkeiten, ein leeres Objekt in JavaScript zu erstellen:

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

Gibt es einen Unterschied darin, wie die Skript-Engine damit umgeht? Gibt es einen Grund, einen über den anderen zu verwenden?

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

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

Objekte

Es gibt keinen Nutzen zu verwenden new Object();- während {};können Sie den Code kompakter und besser lesbar machen.

Für die Definition leerer Objekte sind sie technisch gleich. Die {}Syntax ist kürzer, übersichtlicher (weniger Java-artig) und ermöglicht es Ihnen, das Objekt sofort inline zu füllen - wie folgt:

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

Arrays

Bei Arrays hat die Verwendung von new Array();Over fast keinen Vorteil [];- mit einer kleinen Ausnahme:

var emptyArray = new Array(100);

Erstellt ein 100 Elemente langes Array mit allen Slots, die enthalten undefined- was in bestimmten Situationen (z. B. (new Array(9)).join('Na-Na ') + 'Batman!') hilfreich sein kann .

Meine Empfehlung

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

Ja, es gibt einen Unterschied, sie sind nicht gleich. Es ist wahr, dass Sie die gleichen Ergebnisse erzielen, aber die Engine funktioniert für beide unterschiedlich. Einer von ihnen ist ein Objektliteral und der andere ist ein Konstruktor, zwei verschiedene Arten, ein Objekt in Javascript zu erstellen.

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 bei new Object () Folgendes beachten: Es kann einen Parameter empfangen und abhängig von diesem Parameter wird eine Zeichenfolge, eine Zahl oder nur ein leeres Objekt erstellt.

Beispiel: new Object(1)Gibt eine Nummer zurück. new Object("hello")Wenn eine Zeichenfolge zurückgegeben wird, bedeutet dies, dass der Objektkonstruktor - abhängig vom Parameter - die Objekterstellung an andere Konstruktoren wie Zeichenfolge, Nummer usw. delegieren kann. Dies ist sehr wichtig, wenn Sie dynamische Daten verwalten Objekte erstellen ..

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

Ich empfehle Ihnen, die Unterschiede zwischen der wörtlichen Notation und den Konstruktoren in Javascript weiter zu lesen, um weitere Einzelheiten zu erfahren.

Diese haben das gleiche Endergebnis, aber ich möchte einfach hinzufügen, dass die Verwendung der Literal-Syntax dazu beitragen kann, sich an die Syntax von JSON (eine string-ified-Teilmenge der JavaScript-Literal-Objekt-Syntax) zu gewöhnen .

Eine andere Sache: Sie können subtile Fehler haben, wenn Sie vergessen, den newOperator zu verwenden. Die Verwendung von Literalen hilft Ihnen also, dieses Problem zu vermeiden.

Letztendlich wird es sowohl von der Situation als auch von den Vorlieben abhängen.

Die Literal-Syntax {} / [] für Objekte und Arrays wurde in JavaScript 1.2 eingeführt und ist daher in Versionen von Netscape Navigator vor 4.0 nicht verfügbar (und führt zu einem Syntaxfehler).

Meine Finger sagen immer noch standardmäßig neues Array (), aber ich bin ein sehr alter Mann. Zum Glück ist Netscape 3 kein Browser, den viele Menschen heute jemals in Betracht ziehen müssen ...

var objectA = {}

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

Ich glaube, {}wurde in einem der Javascript-Videos hier als gute Codierungskonvention empfohlen . newist für die pseudoklassische Vererbung notwendig. Der var obj = {};Weg erinnert Sie daran, dass dies keine klassische objektorientierte, sondern eine prototypische Sprache ist. Das einzige Mal, das Sie wirklich brauchen würden, newist, wenn Sie Konstruktorfunktionen verwenden. Zum Beispiel:

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

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

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

Dann wird es so verwendet:

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

Ein weiterer Vorteil der Verwendung {}im Gegensatz zu new Objectist, dass Sie damit Objektliterale im JSON-Stil erstellen können.

Array-Instanziierungsleistung

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 auf Folgendes: https://jsfiddle.net/basickarl/ktbbry5b/

Ich kenne jedoch nicht den Speicherbedarf von beiden, ich kann mir vorstellen, dass dies new Array()mehr Platz beansprucht.

Dies ist im Wesentlichen das gleiche. Verwenden Sie alles, was Sie bequemer finden.

OK , es gibt nur zwei verschiedene Möglichkeiten, dasselbe zu tun! Einer heißt object literalund der andere ist eine Funktion constructor!

Aber lesen Sie weiter, es gibt einige Dinge, die ich gerne teilen möchte:

Durch {}die Verwendung wird Ihr Code besser lesbar, während Instanzen Objectoder andere integrierte Funktionen erstellt werden, die nicht empfohlen werden ...

Außerdem erhält die Objektfunktion Parameter, da es sich um eine Funktion handelt, wie Object(params)... aber es {}ist eine reine Möglichkeit, ein Objekt in JavaScript zu starten ...

Durch die Verwendung von Objektliteral sieht Ihr Code für andere Entwickler viel sauberer und leichter lesbar aus und entspricht den Best Practices in JavaScript ...

Während Objekt in Javascript fast alles sein kann, zeigt es {}nur auf Javascript-Objekte. Führen Sie für den Test, wie es funktioniert, die folgenden Schritte in Ihrem Javascript-Code oder in Ihrer Javascript-Konsole aus:

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

Überraschenderweise wird eine Zahl erstellt!

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

Und das schafft ein 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"}

und dieses seltsame Ergebnis für String!

Wenn Sie also ein Objekt erstellen, wird empfohlen, ein Objektliteral zu verwenden, einen Standardcode zu verwenden und einen Codeunfall wie oben zu vermeiden. Auch die Verwendung {}in Bezug auf die Leistung ist meiner Erfahrung nach besser!