Zusammenfassung der verschiedenen Verwendungsmöglichkeiten von JSON.stringify

Zusammenfassung der verschiedenen Verwendungsmöglichkeiten von JSON.stringify

Vorwort

Jeder, der schon einmal JSON verwendet hat, weiß, dass es eine gängige Methode ist, ein Objekt nach der Infizierung in einen String an das Backend zu übermitteln. Da es in IE6-7 jedoch kein JSON-Objekt gibt, müssen wir zur Implementierung json2.js verwenden.

1. Klassische Verwendung

 var Daten = [
     {Name: "Wukong", Geschlecht: 1, Alter: 30},
     {Name: "Bajie", Geschlecht: 0, Alter: 20},
     {Name: „Tang Monk“, Geschlecht: 1, Alter: 30}
 ]; //Das JavaScript-Array enthält Objekte //Konvertieren Sie das JavaScript-Objekt in einen String im JSON-Format var str_json = JSON.stringify(data);
Konsole.log(str_json);
//Das Ergebnis der Ausführung ist:
//[{"Name": "Wukong", "Geschlecht": 1, "Alter": 30},{"Name": "Bajie", "Geschlecht": 0, "Alter": 20},{"Name": "Tang-Mönch", "Geschlecht": 1, "Alter": 30}]

So einfach! Dies ist auch die Methode, die wir am häufigsten verwenden

2. Extraktion komplexer Daten

Unsere Daten sind beispielsweise sehr komplex und enthalten Informationen wie Avatare, Spitznamen und persönliche Signaturen. Aber ich habe es lokal gespeichert und brauche nur den Benutzernamen und das Geschlecht. Wie mache ich das? Dies können wir tun, indem wir den zweiten Parameter angeben, die Daten durchlaufen und erneut extrahieren.

a. Traditionelle Methode zur Datenextraktion

var Daten = [
    {Name: "Wukong", Geschlecht: 1, Alter: 30},
    {Name: "Bajie", Geschlecht: 0, Alter: 20},
    {Name: „Tang Monk“, Geschlecht: 1, Alter: 30}
];
// Traditionelle Methode zum Extrahieren von Daten var new_data = [];
für (var i=0, neue_Daten=[]; i<Datenlänge; i++) {
    //Erstellen Sie das Zeilenarray new_data.push({
        Name: Daten[i].Name,
        Geschlecht: data[i].age
    });
}
var str_json = JSON.stringify(neue_Daten);
Konsole.log(str_json);

b. Verwenden Sie den zweiten Parameter von stringify, um Daten zu extrahieren

var Daten = [
    {Name: "Wukong", Geschlecht: 1, Alter: 30},
    {Name: "Bajie", Geschlecht: 0, Alter: 20},
    {Name: „Tang Monk“, Geschlecht: 1, Alter: 30}
];

var str_json = JSON.stringify(Daten,["Name","Alter"]);
Konsole.log(str_json);
//Laufende Ergebnisse	
//[{"name":"Wukong","Alter":30},{"name":"Bajie","Alter":20},{"name":"Tang Monk","Alter":30}]

Solange der zweite Parameter das erforderliche Schlüssel-Array übergibt, kann diese Verarbeitung sehr einfach abgeschlossen werden.

Wenn wir es komplizierter handhaben möchten, z. B. 1,0 in männlich oder weiblich ändern möchten, kann der zweite Parameter natürlich von einer Rückruffunktion verarbeitet werden.

var Daten = [
    {Name: "Wukong", Geschlecht: 1, Alter: 30},
    {Name: "Bajie", Geschlecht: 0, Alter: 20},
    {Name: „Tang Monk“, Geschlecht: 1, Alter: 30}
];

var str_json = JSON.stringify(Daten,Funktion (Schlüssel, Wert) {
    wenn(Schlüssel==="Geschlecht"){
        return ["Junge","Mädchen"][Wert];
    }
    Rückgabewert;
});
Konsole.log(str_json);
// [{"name":"Wukong","geschlecht":"weiblich","alter":30},{"name":"Bajie","geschlecht":"männlich","alter":20},{"name":"Tang Monk","geschlecht":"weiblich","alter":30}]

3. Der dritte Parameter „Wu Yong“

Ein sehr nutzloser Parameter, der grundsätzlich nie verwendet wird. Hängt von Ihrer eigenen Situation ab!

var Daten = [
    {Name: "Wukong", Geschlecht: 1, Alter: 30},
    {Name: "Bajie", Geschlecht: 0, Alter: 20},
    {Name: „Tang Monk“, Geschlecht: 1, Alter: 30}
];

var str_json = JSON.stringify(Daten,["Name","Geschlecht"],"\t");
konsole.log(str_json);
/*
[
	{
		"Name": "Wukong",
		"Geschlecht": 1
	},
	{
		"Name": "Bajie",
		"Geschlecht": 0
	},
	{
		"Name": "Tang-Mönch",
		"Geschlecht": 1
	}
]
*/

Wenn Sie nicht verstehen, überprüfen Sie bitte die API

developer.mozilla.org/en-US/docs/…

Zusammenfassen

Dies ist das Ende dieses Artikels über die Verwendung von JSON.stringify. Weitere relevante Inhalte zur Verwendung von JSON.stringify finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

Das könnte Sie auch interessieren:
  • Zusammenfassung der Funktionsweise von JS auf Seiten innerhalb und außerhalb von Iframes
  • So führen Sie eine reibungslose if-Beurteilung in js durch
  • Implementierung einer vereinfachten Version von JSON.stringify und seine sechs Hauptfunktionen im Detail erklärt
  • Vue implementiert eine Online-Vorschau von PDF-Dateien (mithilfe von pdf.js/iframe/embed)
  • Zusammenfassung der Verwendung von JavaScript JSON.stringify()
  • Detaillierte Erläuterung zur Lösung des Zirkelreferenzproblems bei der Verwendung von JSON.stringify
  • Der Unterschied und die Verwendung von json.stringify() und json.parse()
  • Selenium+BeautifulSoup+json ruft die JSON-Daten im Script-Tag ab
  • Informationen zum Ausdruck „wenn Komma enthält“ in JavaScript

<<:  Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.15

>>:  Lösung für das Problem des verweigerten Zugriffs für den Benutzer „root“ @ „localhost“ (mit Kennwort: JA) bei der Anmeldung bei MySQL 8.0 unter Win10

Artikel empfehlen

Es ist ganz einfach zu verstehen, was Node.js ist

Inhaltsverzeichnis Offizielle Einführung in Node....

Erstellen Sie eine virtuelle Umgebung mit venv in Python3 in Ubuntu

1. Virtuelle Umgebung folgt dem Projekt, erstelle...

Müssen die Texte der Website noch gestaltet werden?

Viele fragen sich vielleicht: Muss der Text auf d...

Lösung für das Ausgehen der Auto-Increment-ID (Primärschlüssel) von MySQL

In MySQL werden viele Typen von Auto-Increment-ID...

JavaScript-Timer zum nahtlosen Scrollen von Bildern

In diesem Artikel wird der spezifische JavaScript...

Analysieren Sie das Arbeitsprinzip von Tomcat

SpringBoot ist wie eine riesige Python, die sich ...

Mysql löscht doppelte Daten, um die kleinste ID-Lösung beizubehalten

Suchen Sie online nach doppelten Daten und behalt...

Analyse des Remote-Debuggings und des Timeout-Betriebsprinzips von Webdiensten

Remote-Debugging von Webdiensten In .NET ist die ...

Spezifische Verwendung von Docker Anonymous Mount und Named Mount

Inhaltsverzeichnis Datenvolumen Anonyme und benan...

Beispiel für die Einrichtung eines mehrspaltigen Layouts gleicher Höhe mit CSS

Mehrere Spalten haben zunächst unterschiedliche I...

Implementierung der CSS-Bildlaufleisten-Stileinstellungen

WebKit-Bildlaufleistenstil zurücksetzen 1. Die Bi...

Installieren Sie das komprimierte MySQL5.7-Paket schnell unter Windows

In diesem Artikel erfahren Sie, wie Sie das kompr...

Zwei Möglichkeiten zur Verwendung von React in React HTML

Grundlegende Verwendung <!DOCTYPE html> <...