Please Enable JavaScript!
Gon[ Enable JavaScript ]

자바스크립트 JSON.stringify() 함수 사용하기

웹 프로그래밍/자바스크립트
반응형

JSON.stringify() 함수는 JavaScript에서 JavaScript 객체를 JSON 형식의 문자열로 변환하는 데 사용하는 함수입니다. 이 함수는 JavaScript 객체를 JSON 문자열로 직렬화할 수 있습니다. JSON.stringify() 함수를 사용하여 JavaScript 객체를 JSON 문자열로 변환하면 웹 애플리케이션에서 데이터를 전송하거나 저장할 때 유용하게 사용할 수 있습니다. replacer 함수 및 space 매개변수를 사용하여 직렬화된 JSON 문자열을 조작하고 서식을 지정할 수 있습니다.

 


 

 

1. JSON.stringify() 함수

 

JSON.stringify() 함수는 value로 지정된 JavaScript 객체를 JSON 형식의 문자열로 변환합니다. replacer space는 선택적 매개변수로, 직렬화 중에 속성을 필터링하거나 서식을 지정할 수 있습니다.

 

JSON.stringify(value, replacer, space)
l  value (객체, 필수): JSON으로 변환할 JavaScript 객체입니다.
l  replacer (함수 또는 배열, 선택적): 직렬화 중에 필터링 또는 변환을 수행하는 함수 또는 배열입니다.
l  space (공백 또는 정수, 선택적): 결과 문자열의 서식을 지정하는데 사용되는 문자 또는 공백 수입니다.

 

 

2. 사용 예제

 

(1) 기본 JSON.stringify() 사용

 

const person = {
         name: "John",
         age: 30,
         hobbies: ["Reading", "Music", "Hiking"]
};
 
const jsonString = JSON.stringify(person);
console.log(jsonString);
 
[출력]
{"name":"John","age":30,"hobbies":["Reading","Music","Hiking"]}

  

예제에서 JSON.stringify() 함수를 사용하여 person 객체를 JSON 형식의 문자열로 직렬화합니다. 결과적으로 JSON 문자열은 객체의 속성 및 값으로 구성합니다.

 

 

(2) replacer 함수 사용

 

const person = {
         name: "John",
         age: 30,
         hobbies: ["Reading", "Music", "Hiking"]
};
 
function replacer(key, value) {
         if (key === "hobbies") {
                  return value.join(", "); // 배열 항목을 문자열로 결합
         }
         return value;
}
 
const jsonString = JSON.stringify(person, replacer);
 
console.log(jsonString);
 
[출력]
{"name":"John","age":30,"hobbies":"Reading, Music, Hiking"}

  

예제에서 replacer 함수를 사용하여 person 객체의 "hobbies" 속성 값을 배열에서 문자열로 변환합니다. 결과적으로 JSON 문자열에는 "hobbies" 값이 문자열로 표시됩니다.

 

 

(3) 공백(space) 설정

 

const person = {
         name: "John",
         age: 30
};
 
const jsonString = JSON.stringify(person, null, 2);
 
console.log(jsonString);
 
[출력]
{
  "name": "John",
  "age": 30
}

  

예제에서 space 매개변수를 사용하여 결과 JSON 문자열에 들여쓰기를 적용합니다. JSON이 보기 쉬운 형식으로 출력됩니다.

반응형
Posted by 녹두장군1
,