개발이야기/자바스크립트

[자바스크립트] JSON.stringify(), JSON.parse() 사용해서 JSON 데이터 변환하기 (예제, 사용법)

후린개발자 2023. 10. 4.
반응형

JavaScript에서 JSON은 데이터를 활용하기 위해서는 JSON.stringify(), JSON.parse() 함수는 꼭 알아두어야 합니다.
JSON은 다양한 프로그래밍 언어에서 지원되며, 데이터 교환할때 표준적인 형식이며 구조화된 형식이여서 보안에도 안전합니다.

 

JSON.stringify()

ㅇ JavaScript 객체나 값을 JSON 문자열로 변환하는 데 사용됩니다.
ㅇ JSON 데이터를 생성하고 JavaScript 객체를 문자열로 직렬화합니다.
ㅇ 기본적으로는 모든 객체 속성과 값을 문자열로 변환합니다. 선택적으로 두 번째 인수를 사용하여 원하는 속성만 직렬화하거나 변환 시 공백과 들여쓰기를 제어할 수 있습니다.

 

 

<script>
var person = {
    name: "John",
    age: 30,
    city: "New York"
};

var jsonStr = JSON.stringify(person);
console.log(jsonStr);
console.log(typeof(jsonStr));
// jsonStr은 '{"name":"John","age":30,"city":"New York"}'와 같은 JSON 문자열입니다.
</script>

 

 

ㅇ JSON.stringify() 함수를 사용하여 person 객체를 JSON 형식의 문자열로 직렬화합니다.
ㅇ jsonStr 변수에 결과 JSON 문자열이 할당됩니다.
ㅇ 결과적으로 jsonStr은 {"name":"John","age":30,"city":"New York"}와 같은 JSON 문자열이 됩니다.

 

 

JSON.stringify() 예제

 

JSON.parse()

ㅇ JSON.parse() 함수는 JSON 형식의 문자열을 JavaScript 객체로 파싱(해석)합니다.
ㅇ JSON 문자열을 받아 JavaScript 객체로 변환합니다.

 

<script>
var jsonString = '{"name":"John","age":30,"city":"New York"}';
var person = JSON.parse(jsonString);

console.log(person);
console.log(typeof(person));
// person은 { name: 'John', age: 30, city: 'New York' }와 같은 JavaScript 객체입니다.
</script>

 

ㅇ JSON.parse() 함수를 사용하여 jsonString 변수에 할당된 JSON 형식의 문자열을 JavaScript 객체로 역직렬화(파싱)합니다.

 

JSON.parse() 예제

 

 

JSON.stringify()와 JSON.parse() 함수는 서버와의 데이터 통신 및 데이터 저장과 복원을 위해 주로 사용됩니다.
JSON은 데이터를 구조화하고 다른 플랫폼 및 언어 간에 데이터를 공유하는 데 널리 사용되는 형식이며, JavaScript에서 이러한 함수를 사용하여 JSON 데이터를 생성하고 파싱할 수 있습니다.

반응형

댓글

💲 추천 글