One place for hosting & domains

      Verwenden von JSON.parse() und JSON.stringify()


      Einführung

      Das in allen modernen Browsern verfügbare JSON-Objekt verfügt über zwei nützliche Methoden, um mit JSON-formatierten Inhalten umzugehen: parse und stringify. JSON.parse() nimmt eine JSON-Zeichenfolge und transformiert sie in ein JavaScript-Objekt. JSON.stringify() verwendet ein JavaScript-Objekt und transformiert es in eine JSON-Zeichenfolge.

      Hier ist ein Beispiel:

      const myObj = {
        name: 'Skip',
        age: 2,
        favoriteFood: 'Steak'
      };
      
      const myObjStr = JSON.stringify(myObj);
      
      console.log(myObjStr);
      // "{"name":"Sammy","age":6,"favoriteFood":"Tofu"}"
      
      console.log(JSON.parse(myObjStr));
      // Object {name:"Sammy",age:6,favoriteFood:"Tofu"}
      

      Und obwohl die Methoden normalerweise bei Objekten verwendet werden, können sie auch bei Arrays verwendet werden:

      const myArr = ['bacon', 'lettuce', 'tomatoes'];
      
      const myArrStr = JSON.stringify(myArr);
      
      console.log(myArrStr);
      // "["shark","fish","dolphin"]"
      
      console.log(JSON.parse(myArrStr));
      // ["shark","fish","dolphin"]
      

      JSON.parse()

      JSON.parse() kann eine Funktion als zweites Argument übernehmen, das die Objektwerte ändern kann, bevor sie zurückgegeben werden. Hier werden die Werte des Objekts im zurückgegebenen Objekt der Methode parse in Großbuchstaben transformiert:

      const user = {
        name: 'Sammy',
        email: '[email protected]',
        plan: 'Pro'
      };
      
      const userStr = JSON.stringify(user);
      
      JSON.parse(userStr, (key, value) => {
        if (typeof value === 'string') {
          return value.toUpperCase();
        }
        return value;
      });
      

      Hinweis: Nachkommas sind in JSON nicht gültig, sodass JSON.parse() eine Fehlermeldung auslöst, wenn die übergebene Zeichenfolge Nachkommas enthält.

      JSON.stringify()

      JSON.stringify() kann zwei zusätzliche Argumente annehmen, wobei das erste eine Ersatzfunktion und das zweite ein Zeichenfolgen– oder Zahlenwert ist, der als Leerzeichen in der zurückgegebenen Zeichenfolge zu verwenden ist.

      Die Ersatzfunktion kann zum Herausfiltern von Werten verwendet werden, da jeder als undefiniert zurückgegebene Wert aus der zurückgegebenen Zeichenfolge herausfällt:

      const user = {
        id: 229,
        name: 'Sammy',
        email: '[email protected]'
      };
      
      function replacer(key, value) {
        console.log(typeof value);
        if (key === 'email') {
          return undefined;
        }
        return value;
      }
      
      const userStr = JSON.stringify(user, replacer);
      // "{"id":229,"name":"Sammy"}"
      

      Und ein Beispiel mit einem eingefügten Raum-Argument:

      const user = {
        name: 'Sammy',
        email: '[email protected]',
        plan: 'Pro'
      };
      
      const userStr = JSON.stringify(user, null, '...');
      // "{
      // ..."name": "Sammy",
      // ..."email": "[email protected]",
      // ..."plan": "Pro"
      // }"
      

      Zusammenfassung

      In diesem Tutorial haben Sie untersucht, wie die Methoden JSON.parse() und JSON.stringify() verwendet werden.  Wenn Sie mehr über die Arbeit mit JSON in Javascript erfahren möchten, lesen Sie unser Tutorial Wie man mit JSON in JavaScript arbeitet.

      Weitere Informationen zum Kodieren in JavaScript finden Sie in unserer Reihe Wie man in JavaScript kodiert oder sehen Sie sich unsere JavaScript-Seite Übungen und Programmierprojekte an.



      Source link


      Leave a Comment