TypeError: Zirkuläre Struktur in JSON konvertieren

Wenn wir ein Objekt mit zirkulären Referenzen an die Funktion JSON.stringify() senden, erhalten wir das Problem TypeError: Converting circular structure to JSON. Vermeiden Sie Zirkelverweise, bevor Sie das Objekt in JSON konvertieren.

Fix TypeError: Converting circular structure to JSON in JavaScript

Dieses Problem kann mit dem Paket flatted gelöst werden. Das Paket flatted ist ein unglaublich leichter und schneller Circular JSON-Parser, direkt vom Erfinder von CircularJSON.

Zuerst müssen Sie ein flatted-Paket installieren, und Sie können dies auf folgende Weise tun.

npm i flatted

Sehen wir uns ein Beispiel für die Verwendung eines flatted-Pakets an.

const {parse, stringify} = require('flatted/cjs');

var sports = [{cricket: 1}, {football: '2'}];
sports[0].a = sports;
stringify(sports);

console.log(sports);

Ausgang:

JSON.stringify() wandelt nicht nur gültige Objekte in Strings um, sondern hat auch einen Ersetzungsparameter, der Werte ersetzen kann, wenn die Funktion konfiguriert ist.

let sportsmanObj = {
  name: 'Shiv',
  age: 22,
  gender: 'Male',
};

sportsmanObj.myself = sportsmanObj;

const circularFunc = () => {
  const sited = new WeakSet();
  return (key, value) => {
    if (typeof value === 'object' && value !== null) {
      if (sited.has(value)) {
        return;
      }
      sited.add(value);
    }
    return value;
  };
};

JSON.stringify(sportsmanObj, circularFunc());
console.log(sportsmanObj);

Code ausführen

Wir rufen das Objekt WeakSet in unserem obigen circularFunc auf, das ein Objekt ist, das schwach gehaltene Elemente oder Zeiger auf Dinge speichert.

Jedes Objekt in einem WeakSet kann nur einmal vorkommen, wodurch sich wiederholende oder zirkuläre Daten entfernt werden. Das Schlüsselwort new ist ein Operator zum Erstellen eines neuen Objekts.

Wir haben if-Anweisungen in unserer return-Anweisung verschachtelt. Der Operator typeof wird in unserer ersten if-Anweisung verwendet, um die Primitive zurückzugeben (Undefined, Null, Boolean, Number, String, Function, BigInt, Symbol ) ausgewertet.

Wenn unser Werttyp genau einem Objekt entspricht und die Wichtigkeit dieses Objekts nicht null ist, wird mit der zweiten if-Bedingung fortgefahren, die prüft, ob der Wert in WeakSet() enthalten ist. Wir senden unsere ursprüngliche kreisförmige Struktur und Ersetzungsmethode an JSON.stringify().

Dadurch erhalten wir das gestringte Ergebnis, das wir auf der Konsole wollen.

{
  age: 22,
  gender: "Male",
  myself: [circular object Object],
  name: "Shiv"
}