Javascript-Objektliteral: Was genau ist {a, b, c}?

Lesezeit: 4 Minuten

Javascript Objektliteral Was genau ist a b c
drmrbrewer

Die Frage, die ich habe, wird am besten durch gegeben diese jsfiddleder Code dafür ist unten:

var a = 1, b = 'x', c = true;

var d = {a: a, b: b, c: c}; // <--- object literal
var e = [a, b, c];          // <--- array
var f = {a, b, c};          // <--- what exactly is this??

// these all give the same output:
alert(d.a  + ', ' + d.b +  ', ' + d.c );
alert(e[0] + ', ' + e[1] + ', ' + e[2]);
alert(f.a  + ', ' + f.b +  ', ' + f.c );

Was für eine Datenstruktur ist f? Ist es nur eine Abkürzung für d?

  • Der erste ist eigentlich kein JSON.

    – GolezTrol

    22. Dezember 2015 um 11:24 Uhr

  • OK @GolezTrol, es ist nicht ausschließlich JSON, da die Schlüssel nicht in doppelten Anführungszeichen stehen. Also was genau möchten du nennst die d Datenstruktur in meinem Beitrag?

    – drmrbrewer

    22. Dezember 2015 um 11:34 Uhr

  • Es ist wichtig zu verstehen, dass keine der Versionen gültiges JSON ist. Die Möglichkeit, die Daten als JSON-String darzustellen, wäre {"a" : 1, "b" : "x", "c" : true }

    – Benjamin Grünbaum

    22. Dezember 2015 um 12:38 Uhr


  • @drmrbrewer Es ist ein Objektliteral. es ist nicht JSON, weil es ist Javascript-Code, während JSON ein Serialisierungsformat ist. Zum Beispiel var a = '{ "a" : "value"}' -> a enthält eine Zeichenfolge, die über in ein Objekt deserialisiert werden kann JSON.parse.

    – Mondwelle99

    22. Dezember 2015 um 12:52 Uhr


Javascript Objektliteral Was genau ist a b c
madox2

var f = {a, b, c};

Es kam mit ES6 (ECMAScript 2015) und bedeutet genau dasselbe wie:

var f = {a: a, b: b, c: c};

Es heißt Object Literal Property Value Shorthands (oder einfach Property Value Shorthand, Shorthand Properties).

Sie können auch Abkürzungen mit klassischer Initialisierung kombinieren:

var f = {a: 1, b, c};

Weitere Informationen finden Sie unter Objektinitialisierer.

1647272719 422 Javascript Objektliteral Was genau ist a b c
Leere

Es ist ein Objektinitialisierer Eigenschaft Kurzschrift in ES6.

var f = {a, b, c, d:1}; // Will be equal to {a:a, b:b, c:c, d:1}

Dies funktioniert, weil der Eigenschaftswert den gleichen Namen wie der Eigenschaftsbezeichner hat. Dies ist eine neue Ergänzung zur Syntax von Objekt-Initialisierer (Abschnitt 11.1.5) spätestens ECMAScript 6 Entwurf Rev. 13. Und natürlich können Sie, genau wie bei den Einschränkungen von ECMAScript 3, kein reserviertes Wort als Eigenschaftsnamen verwenden.

Eine solche Abkürzung wird Ihren Code nicht dramatisch verändern, es macht nur alles ein bisschen süßer!

function createCar(name, brand, speed) {
  return { type: 'Car', name: name, brand: brand, speed: speed };
}

// With the new shorthand form
function createSweetCar(name, brand, speed) {
  return { type: 'Car', name, brand, speed }; // Yes it looks sweet.
}

Informationen zur Unterstützung dieser Notationen finden Sie in der Kompatibilitätstabelle. In nicht unterstützenden Umgebungen führen diese Notationen zu Syntaxfehlern.

Diese Kurzschreibweise bietet eine ziemlich gute Objektanpassung:

Im ECMAScript5 was wir früher gemacht haben:

var tmp = getData();
var op  = tmp.op;
var lhs = tmp.lhs;
var rhs = tmp.rhs;

Kann in gemacht werden ECMAScript6 mit einer einzigen Codezeile:

var { op, lhs, rhs } = getData();

  • Warum wäre dies so nützlich, um ein Sprachfeature zu werden? Es scheint viel üblicher zu sein, das Objekt entweder direkt mit Literalen, Rückgabewerten und dergleichen zu initialisieren oder das Objekt zuerst zu erstellen und dann die Eigenschaften direkt festzulegen. Das Erstellen von Variablen mit denselben Namen, deren Instanziierung und die abschließende Initialisierung des Objekts auf diese Weise erscheint einfach ungewöhnlich … oder doch?

    – Panzerkrise

    22. Dezember 2015 um 15:27 Uhr


  • @Panzercrisis Es scheint, als würde es persönlich nur zu vielen unbeabsichtigten und schwer zu findenden Fehlern führen. Genauso wie das Zulassen if(a = 1) {...} wie es die gültige Syntax tut.

    – Anthony Grist

    22. Dezember 2015 um 16:27 Uhr

  • @Panzercrisis Ich denke, es macht zumindest Sinn, wenn Sie sich vorstellen, dass a, b und c komplexere Datenstrukturen sind und f auch andere komplexe Eigenschaften enthält. Ich bin mir immer noch nicht sicher, ob es eine großartige Idee ist, aber ich könnte sehen, dass es nützlich ist.

    – Josh Rumbut

    22. Dezember 2015 um 23:10 Uhr

  • @Panzercrisis es kann sehr nützlich sein, ein Tupel von einer Lambda-Funktion zurückzugeben, so etwas wie (a, b) => {a, b}. So habe ich zumindest die gleiche Funktion in verwendet C#.

    – Vincent van der Weele

    23. Dezember 2015 um 6:00 Uhr


  • @Alex wie ist das eine “Eigenart” oder “Komplex”? Eine sehr häufige Sache, die Sie normalerweise in vielen Codebasen finden würden, ist die Initialisierung eines Objekts, bei dem der Schlüssel mit der als Wert angegebenen Variablen übereinstimmt {id: id, data: data, isSelected: isSelected} usw. Passiert viel, wenn eingehende Objekte auf lokale Objekte und dann wieder zurück abgebildet werden. In den meisten Fällen möchten Sie Ihre Sachen nicht etwas anders benennen {identifier: id, viewData: data, isElementSelected: isSelected } ist genau das “schrullig”, “komplex” und “verwirrend”, von dem Sie sprechen.

    – VLAZ

    22. Februar 2019 um 12:29 Uhr

var f = {a, b, c};          // <--- what exactly is this??

Es definiert ein Objekt in JavaScript unter Verwendung der neuen Notation ECMAScript 2015:

Gem Mozilla-Entwicklernetzwerk:

„Objekte können mit new Object(), Object.create() oder mit der wörtlichen Notation (Initialisierernotation) initialisiert werden Geschweifte Klammern ({}).”

var a = "foo", 
    b = 42, 
    c = {};

// Shorthand property names (ES6)
var o = { a, b, c }; 

ist äquivalent zu:

var a = "foo", 
    b = 42,
    c = {};

var o = { 
  a: a,
  b: b,
  c: c
};

1002180cookie-checkJavascript-Objektliteral: Was genau ist {a, b, c}?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy