Maison >interface Web >js tutoriel >Utilisations peu connues de JSON.stringify

Utilisations peu connues de JSON.stringify

青灯夜游
青灯夜游avant
2019-11-30 17:39:123033parcourir

Il existe de nombreuses fonctions communes dans JS. Nous pouvons les utiliser tous les jours, mais nous ne connaissons pas certaines de leurs fonctions supplémentaires. JSON.stringify est une telle fonction. Jetons un coup d'œil à son utilisation particulière aujourd'hui. La méthode

Utilisations peu connues de JSON.stringify

Basic

JSON.stringify reçoit une variable et la convertit en une représentation JSON.

const boy = { 
  name: 'John', 
  age: 23 
};

JSON.stringify(boy);
// {"name":"John","age":23}

JSON est une chaîne pure, qui est essentiellement un sous-ensemble de JS, donc tous les objets JS ne peuvent pas être convertis en JSON :

const boy = { 
  name: 'John', 
  age: 23,
  hobbies: new Map([[0, 'coding'], [1, 'earn money']])
}

JSON.stringify(boy)
// {"name":"John","age":23,"hobbies":{}}

Dans l'exemple ci-dessus, l'objet Map est Sera ignoré et converti en un objet normal. Si l'attribut est une fonction, cet attribut sera ignoré. Les étudiants intéressés peuvent l'essayer.

Deuxième paramètre

JSON.stringify peut recevoir un deuxième paramètre, qui peut être appelé un replacer remplaçant.

Vous pouvez transmettre un tableau de chaînes, et seules les propriétés de ce tableau seront converties, tout comme une liste blanche.

const boy = { 
  name: 'John', 
  age: 23
}

JSON.stringify(boy, ['name'])
// {"name":"John"}

Nous pouvons utiliser cette fonctionnalité pour convertir uniquement les attributs qui doivent être convertis et filtrer les longs tableaux, les objets d'erreur, etc.

Ce replacer paramètre peut également recevoir une fonction. Cette fonction parcourt l'intégralité de l'objet, en transmettant les clés et les valeurs, et vous permet de décider comment les remplacer.

const boy = { 
  name: 'John', 
  age: 23,
  hobbies: new Map([[0, 'coding'], [1, 'earn money']])
}

JSON.stringify(boy, (key, value) => {
  if (value instanceof Map) {
    return [...value.values()]
  }
  return value
})
// {"name":"John","age":23,"hobbies":["coding","earn money"]}

Et si vous retournez undefined (retourner null ne fonctionne pas), cet attribut sera supprimé :

JSON.stringify(boy, (key, value) => {
  if (typeof value === 'string') {
    return undefined
  }
  return value
})
// {"age":23,"hobbies":{}}

Le troisième paramètre

Le troisième paramètre space contrôle l'espacement de la chaîne JSON convertie.

Si le paramètre est un nombre, indentez du nombre d'espaces :

JSON.stringify(boy, null, 2)
// {
//   "name": "John",
//   "age": 23,
//   "hobbies": {}
// }

Et si le paramètre est une chaîne, indentez de la chaîne :

JSON.stringify(boy, null, '--')
// {
//   --"name": "John",
//   --"age": 23,
//   --"hobbies": {}
// }

Méthode toJSON

Si l'objet que nous voulons convertir a une méthode toJSON, nous pouvons personnaliser le processus de sérialisation. Au lieu de sérialiser l'objet, vous pouvez renvoyer une nouvelle valeur à partir de la méthode, et cette valeur sera sérialisée à la place de l'objet d'origine.

const boy = { 
  name: 'John', 
  age: 23,
  hobbies: new Map([[0, 'coding'], [1, 'earn money']]),
  toJSON() {
    return {
      name: `${this.name} (${this.age})`,
      favorite: this.hobbies.get(0)
    }
  }
}

JSON.stringify(boy)
// {"name":"John (23)","favorite":"coding"}

N'est-ce pas intéressant ? Il est parfois utile de lire attentivement certains documents~

Article de référence

  • Adresse originale : https://mp .weixin.qq.com/s/_e83_G7RjVt2eR_ro7blOA

  • MDN : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON / stringify

Cet article provient de la colonne tutoriel js, bienvenue pour apprendre !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer