Javascript-Objekt vs. JSON

Lesezeit: 3 Minuten

Javascript Objekt vs JSON
Kopenhagen

Ich möchte die grundlegenden Unterschiede zwischen Javascript-Objekt und JSON-String klar verstehen.

Nehmen wir an, ich erstelle die folgende JS-Variable:

var testObject = {one: 1,"two":2,"three":3};

Q1. Ist der Schlüssel-/Eigenschaftsname sowohl mit als auch ohne Anführungszeichen gültig? (z.B "one" : 1)

Wenn ja, was ist der Unterschied?

Q2: Wenn ich das obige Objekt mit konvertiere JSON.stringify(testObject)was ist der Unterschied zwischen dem ursprünglichen JS-Objekt und dem JSON?

Ich habe das Gefühl, dass sie fast gleich sind. Bitte erläutern Sie dies.

F3: Wird die folgende Methode zum Analysieren einer JSON-Zeichenfolge empfohlen?

var javascriptObj = JSON.parse(jSonString);

Javascript Objekt vs JSON
Matt

  1. Ist der Schlüssel-/Eigenschaftsname sowohl mit als auch ohne Anführungszeichen gültig?

Sie müssen einen Schlüssel nur dann in Anführungszeichen setzen, wenn Sie die Objektliteralnotation verwenden, wenn der Schlüssel ein Sonderzeichen enthält (if, :, - etc). Es ist erwähnenswert, dass ein Schlüssel in JSON Muss eingeschlossen sein doppelt Zitate.

  1. Wenn ich das obige Objekt mit var jSonString = JSON.stringify(testObject);was ist der Unterschied zwischen den 2 (JS obj und JSON)?

JSON ist ein Datenaustauschformat. Es ist ein Standard, der beschreibt, wie geordnete Listen und ungeordnete Maps, Strings, Booleans und Zahlen in einem String dargestellt werden können. So wie XML und YAML eine Möglichkeit sind, strukturierte Informationen zwischen Sprachen zu übertragen, ist JSON dasselbe. Ein JavaScript-Objekt hingegen ist ein physischer Typ. Genau wie ein PHP-Array, eine C++-Klasse/Struktur, ist ein JavaScript-Objekt ein JavaScript-interner Typ.

Hier ist eine Geschichte. Stellen Sie sich vor, Sie haben Möbel in einem Geschäft gekauft und möchten, dass sie geliefert werden. Das einzige, das auf Lager ist, ist jedoch das Ausstellungsmodell, aber Sie stimmen zu, es zu kaufen.

Im Shop ist die von Ihnen erworbene Kommode ein lebendiges Objekt:

    var chestOfDrawers = {
        color: "red",
        numberOfDrawers: 4
    }

Allerdings kann man eine Kommode nicht per Post verschicken, also zerlegt man sie (liest, fädelt sie ein). Es ist jetzt nutzlos in Bezug auf Möbel. Es ist jetzt JSON. Es ist in flacher Packungsform.

    {"color":"red","numberOfDrawers":4}

Wenn Sie es erhalten, bauen Sie die Kommode wieder auf (lesen, analysieren). Es ist jetzt wieder in Objektform.

Der Grund hinter JSON, XML und YAML ist, dass Daten zwischen Programmiersprachen in einem Format übertragen werden können, das beide teilnehmenden Sprachen verstehen können; Sie können PHP oder C++ Ihr JavaScript-Objekt nicht direkt übergeben; weil jede Sprache ein Objekt unter der Haube anders darstellt. Da wir das Objekt jedoch in die JSON-Notation gestringt haben; dh eine standardisierte Art, Daten darzustellen, können wir die JSON übertragen Darstellung des Objekts in eine andere Sprache (C++, PHP) können sie neu erstellen das JavaScript-Objekt, das wir hatten, in ihr eigenes Objekt basierend auf der JSON-Darstellung des Objekts.

Es ist wichtig zu beachten, dass JSON keine Funktionen oder Daten darstellen kann. Wenn Sie versuchen, ein Objekt mit einem Funktionsmember zu stringifizieren, wird die Funktion aus der JSON-Darstellung weggelassen. Ein Datum wird in einen String umgewandelt;

    JSON.stringify({
        foo: new Date(),
        blah: function () { 
            alert('hello');
        }
    }); // returns the string "{"foo":"2011-11-28T10:21:33.939Z"}"
  1. Wird die folgende Methode zum Analysieren einer JSON-Zeichenfolge empfohlen? var javascriptObj = JSON.parse(jSonString);

Ja aber ältere Browser unterstützen JSON nicht nativ (IE <8). Um diese zu unterstützen, sollten Sie einbeziehen json2.js.

Wenn Sie jQuery verwenden, können Sie anrufen jQuery.parseJSON()die verwendet werden JSON.parse() unter der Haube, wenn es unterstützt wird, und wird ansonsten auf eine benutzerdefinierte Implementierung zurückgreifen, um die Eingabe zu analysieren.

  • @testndtv Sie verpassen den Punkt – obwohl auf Papier (oder auf dem Bildschirm) eine JSON-Zeichenfolge und die Anzeige eines JS-Objekts kann sehen das gleiche, sie sind nicht dasselbe. JSON ist nur eine Möglichkeit, ein Objekt in einen String zu packen, damit es irgendwohin übertragen und später wieder in ein Objekt entpackt werden kann.

    – Alnitak

    28. November 2011 um 10:03 Uhr

  • @Matt schlechte Analogie IMHO – JSON sollte nicht zum Serialisieren eines Objekts mit Methoden verwendet werden – nur für reine Datenobjekte.

    – Alnitak

    28. November 2011 um 10:04 Uhr

  • @Growler: Normalerweise verwende ich JSON, wenn das “Ding” sein muss generiert auf dem Server, und verwende eine js-Datei, wenn das “Ding” gerade ist serviert wie es ist. Das andere große Unterscheidungsmerkmal ist, ob Sie Funktionen und/oder Datumsangaben einschließen müssen, da JSON diese nicht darstellen kann, sodass Sie auf die Bereitstellung einer JS-Datei zurückgreifen müssen. Wenn Sie sich immer noch nicht sicher sind, können Sie sie gerne als separate Frage zu Stack Overflow stellen (zeigen Sie ein Beispiel für den Inhalt, den Sie zur Darstellung Ihres Dialogs bereitstellen müssen) und geben Sie mir den Link. Gerne schaue ich genauer hin!

    – Matt

    15. Mai 2014 um 7:16 Uhr


  • @Matt Sie, mein Herr, sind ein verdammtes Genie! Ihre Erklärung ist genau richtig, klar, prägnant und leicht verständlich. Ich wünschte, du wärst mein JavaScript-/Programmier-Mentor.

    – Frank Draws

    18. September 2015 um 14:56 Uhr

  • @Matt mag die Möbelanalogie wirklich. Möchte mehr davon sehen, leichter verständlich, gleich zugreifen, nicht vergessen.

    – Jeb50

    25. Februar 2017 um 6:12 Uhr

1646321116 371 Javascript Objekt vs JSON
Ben Lee

F1: Beim Definieren von Objektliteralen in Javascript können die Schlüssel Anführungszeichen enthalten oder nicht. Es gibt keinen Unterschied, außer dass Sie mit Anführungszeichen bestimmte Schlüssel angeben können, die dazu führen würden, dass der Interpreter nicht analysiert werden kann, wenn Sie sie unverpackt versuchen. Wenn Sie beispielsweise einen Schlüssel wünschen, der nur ein Ausrufezeichen ist, benötigen Sie Anführungszeichen:

a = { "!": 1234 } // Valid
a = { !: 1234 } //  Syntax error

In den meisten Fällen können Sie jedoch die Anführungszeichen um Schlüssel auf Objektliteralen weglassen.

F2: JSON ist buchstäblich eine Zeichenfolgendarstellung. Es ist nur eine Schnur. Bedenken Sie also Folgendes:

var testObject = { hello: "world" }
var jSonString = JSON.stringify(testObject);

Seit testObject ein echtes Objekt ist, können Sie Eigenschaften darauf aufrufen und alles andere tun, was Sie mit Objekten tun können:

testObject.hello => "world"

Andererseits, jsonString ist nur eine Zeichenfolge:

jsonString.hello => undefined

Beachten Sie einen weiteren Unterschied: In JSON müssen alle Schlüssel in Anführungszeichen gesetzt werden. Das steht im Gegensatz zu Objektliteralen, bei denen die Anführungszeichen gemäß meiner Erklärung in Q1 normalerweise weggelassen werden können.

Q3. Sie können eine JSON-Zeichenfolge analysieren, indem Sie verwenden JSON.parse, und dies ist im Allgemeinen der beste Weg, dies zu tun (wenn der Browser oder ein Framework dies bereitstellt). Sie können auch einfach verwenden eval da JSON ein gültiger Javascript-Code ist, aber die erstere Methode aus einer Reihe von Gründen empfohlen wird (eval ist mit vielen unangenehmen Problemen verbunden).

Durch JSON gelöste Probleme

Angenommen, Sie möchten reguläre JavaScript-Objekte zwischen zwei Computern austauschen und legen zwei Regeln fest:

  • Die übertragenen Daten müssen eine regelmäßige Zeichenfolge sein.
  • Es können nur Attribute ausgetauscht werden, Methoden werden nicht übertragen.

Jetzt erstellen Sie zwei Objekte auf dem ersten Host:

var obj1 = { one: 1,"two":2,"three":3 }; // your example
var obj2 = { one: obj1.one, two: 2, three: obj1.one + obj1.two };

Wie können Sie diese Objekte in Zeichenfolgen für die Übertragung an den zweiten Host umwandeln?

  • Für das erste Objekt könnten Sie diese aus der Literaldefinition erhaltene Zeichenfolge senden '{ one: 1,"two":2,"three":3 }', aber tatsächlich können Sie das Literal im Skriptteil des Dokuments nicht lesen (zumindest nicht einfach). Damit obj1 und obj2 müssen eigentlich genauso verarbeitet werden.
  • Sie müssen alle Attribute und ihren Wert aufzählen und eine Zeichenfolge ähnlich dem Objektliteral erstellen.

JSON wurde als Lösung für die gerade besprochenen Anforderungen entwickelt: Es ist eine Reihe von Regeln, um eine Zeichenfolge zu erstellen, die einem Objekt entspricht, indem alle Attribute und Werte aufgelistet werden (Methoden werden ignoriert).

JSON normalisiert die Verwendung von doppelten Anführungszeichen für Attributnamen und -werte.

Denken Sie daran, dass JSON nur ein Satz von Regeln ist (ein Standard).

Wie viele JSON-Objekte werden erstellt?

Nur eine, sie wird automatisch von der JS-Engine erstellt.

Moderne JavaScript-Engines, die in Browsern zu finden sind, haben ein natives Objekt, auch JSON genannt. Dieses JSON-Objekt kann:

  • Decodieren Sie eine Zeichenfolge, die mit dem JSON-Standard erstellt wurde, mit JSON.parse(string). Das Ergebnis ist ein reguläres JS-Objekt mit Attributen und Werten, die in der JSON-Zeichenfolge gefunden werden.

  • Codieren Sie Attribute / Werte eines regulären JS-Objekts mit JSON.stringify(). Das Ergebnis ist eine Zeichenfolge, die mit dem JSON-Regelsatz konform ist.

Das (einzelne) JSON-Objekt ähnelt einem Codec, seine Funktion besteht darin, zu codieren und zu decodieren.

Beachten Sie, dass:

  • JSON.parse() erstellt kein JSON-Objekt, sondern ein reguläres JS-Objekt. Es gibt keinen Unterschied zwischen einem Objekt, das mit einem Objektliteral erstellt wurde, und einem Objekt, das von JSON.parse() aus einer JSON-kompatiblen Zeichenfolge erstellt wurde.

  • Es gibt nur ein JSON-Objekt, das für alle Konvertierungen verwendet wird.

Zurück zu den Fragen:

  • F1: Die Verwendung von einfachen oder doppelten Anführungszeichen ist für Objektliterale erlaubt. Beachten Sie, dass die Anführungszeichen optional für Attributnamen verwendet werden und für Zeichenfolgenwerte obligatorisch sind. Das Objektliteral selbst wird nicht in Anführungszeichen gesetzt.

  • F2: Objekte, die aus Literalen erstellt wurden und JSON.parse() verwenden, sind genau gleich. Diese beiden Objekte sind nach der Erstellung gleichwertig:

    var obj1 = { one: 1, "two": 2, "three": 3 };
    var obj2 = JSON.parse('{ "one": "1", "two": "2", "three": "3" }');

  • Q3: Auf modernen Browsern JSON.parse() wird verwendet, um ein JS-Objekt aus einer JSON-kompatiblen Zeichenfolge zu erstellen. (jQuery hat auch eine äquivalente Methode, die für alle Browser verwendet werden kann).

  • Es scheint mir, dass in Q2 die Objekte obj1 und obj2 tatsächlich unterschiedlich sind, da die JSON-Zeichenfolge die Zeichenfolgenwerte „1“, „2“ und „3“ enthält, während die Literaldefinition die Ganzzahlen 1, 2 und 3 enthält.

    – tebb

    2. Oktober 2020 um 17:14 Uhr

  • @tebb: Richtig. Ich hätte keine Strings für die Zahlen in obj2 verwenden sollen. Die zu analysierende Zeichenfolge enthält Ganzzahlen, dann enthält das js-Objekt auch Ganzzahlen (und beide Objekte sind gleich).

    – Min

    2. Oktober 2020 um 18:32 Uhr

Q1 – In JS müssen Sie nur Anführungszeichen verwenden, wenn der Schlüssel ein reserviertes Wort ist oder wenn es sich sonst um ein illegales Token handeln würde. In JSON MÜSSEN Sie Schlüsselnamen immer in doppelte Anführungszeichen setzen.

Q2 – die jsonString ist ein serialisiert Version des Eingabeobjekts …

Q3 – was sein kann deserialisiert zu einem identisch aussehenden Objekt mit JSON.parse()

Die Frage hat bereits gute Antworten gepostet. Ich füge unten ein kleines Beispiel hinzu, das das Verständnis der Erklärungen in früheren Antworten erleichtert. Kopieren Sie das folgende Snippet in Ihre IDE, um es besser zu verstehen, und kommentieren Sie die Zeile, die es enthält invalid_javascript_object_no_quotes Objektdeklaration, um Kompilierzeitfehler zu vermeiden.

// Valid JSON strings(Observe quotes)
valid_json = '{"key":"value"}'
valid_json_2 = '{"key 1":"value 1"}' // Observe the space(special character) in key - still valid


//Valid Javascript object
valid_javascript_object_no_quotes = {
    key: "value"  //No special character in key, hence it is valid without quotes for key
}


//Valid Javascript object
valid_javascript_object_quotes = {
    key:"value",  //No special character in key, hence it is valid without quotes for key
    "key 1": "value 1" // Space (special character) present in key, therefore key must be contained in double quotes  - Valid
}



console.log(typeof valid_json) // string
console.log(typeof valid_javascript_object_no_quotes) // object
console.log(typeof valid_javascript_object_quotes) // object

//Invalid Javascript object 
invalid_javascript_object_no_quotes = {
   key 1: "value"//Space (special character) present in key, since key is not enclosed with double quotes "Invalid Javascript Object"
}

924760cookie-checkJavascript-Objekt vs. JSON

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

Privacy policy