TypeError: 원형 구조를 JSON으로 변환

Shiv Yadav 2024년2월15일
TypeError: 원형 구조를 JSON으로 변환

JSON.stringify() 함수에 대한 순환 참조를 포함하는 객체를 보낼 때 TypeError: Converting circular structure to JSON 문제가 발생합니다. 객체를 JSON으로 변환하기 전에 순환 참조를 피하십시오.

JavaScript에서 TypeError: 원형 구조를 JSON으로 변환 수정

이 문제는 flatted 패키지를 사용하여 해결할 수 있습니다. flatted 패키지는 CircularJSON의 발명가가 직접 제공하는 놀랍도록 가볍고 빠른 Circular JSON 파서입니다.

먼저 flatted 패키지를 설치해야 하며 다음과 같은 방법으로 설치할 수 있습니다.

npm i flatted

flatted 패키지를 사용하는 한 가지 예를 살펴보겠습니다.

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

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

console.log(sports);

출력:

플랫 패키지 사용

JSON.stringify()는 유효한 객체를 문자열로 변환할 뿐만 아니라 함수가 구성된 경우 값을 대체할 수 있는 replacer 매개변수도 있습니다.

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);

실행 코드

위의 circularFunc에서 WeakSet 개체를 호출하고 있습니다. 이 개체는 약하게 유지되는 항목이나 사물에 대한 포인터를 저장하는 개체입니다.

WeakSet의 각 개체는 한 번만 나타날 수 있으며 반복적이거나 순환적인 데이터를 제거합니다. new 키워드는 새 개체를 만드는 연산자입니다.

우리는 return 문에 if 문을 중첩했습니다. typeof 연산자는 프리미티브(Undefined, Null, Boolean, Number, String, Function, BigInt, Symbol를 반환하기 위해 첫 번째 if 문에서 사용됩니다. ) 평가를 받고 있습니다.

값 유형이 객체와 정확하게 동일하고 해당 객체의 중요도가 null이 아닌 경우 두 번째 if 조건으로 진행하여 값이 WeakSet()에 있는지 확인합니다. 우리는 원래의 순환 구조와 교체 메서드를 JSON.stringify()로 보냅니다.

이렇게 하면 콘솔에서 원하는 문자열화된 결과를 얻을 수 있습니다.

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

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.

LinkedIn

관련 문장 - JavaScript Error