본문 바로가기

WEB

[JavaScript] JSON 사용하기 / JSON.parse() / JSON.stringify()

JSON을 사용하는 방법을 알아봅시다! 😋


JSON이란,

키 - 값 쌍으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷입니다.

 


JSON 문자열 작성 형식

  1. { }
  2. [ ]

두가지가 존재합니다.

{
	 "키값" : value, "키값2":value2, ...
}

여기서 키값은 반드시 double quotation ""로 감싸야 합니다.

 

 

value가 될 수 있는 형식에는 여러가지가 있습니다.

숫자 : 10 또는 10.1 같이 숫자를 작성하면된다.           
문자 : "xxx"  double quotation 으로 감싸면 된다.           
논리값 : true or false 를 작성하면 된다.           
object : { }           
array : [ ]           
빈값 : null           

function은 존재하지 않습니다.

 


JSON.parse() / JSON.stringify() 사용해보기

 

1. JSON.parse()

let info = `
{
	"num":1,
	"name":"이름",
	"isMan":true,
	"phone":{
		"brand":"apple",
		"color":"pink"
	},
	"friends":["친구1","친구2","친구3"],
	"pocket":null
	}
`;

이 info를 서버로부터 받아온 문자열이라고 가정해봅시다.

 

 

let obj = JSON.parse(info);

JSON형식의 info를 object로 변환하기 위해서는 JSON.parse()를 사용해야합니다.

 

 

let result1 = obj.num;
let result2 = obj.name;
let result3 = obj.phone;
let result4 = obj.phone.brand;
let result5 = obj.phone.color;
let result6 = obj.friends;
let result7 = obj.friends[0];
let result8 = obj.friends[1];
result1
>> 1
result4
>> 'apple'
result5
>> 'pink'

object로 변환되었으니 .을 사용하여 원하는 데이터에 접근할 수 있습니다.


2. JSON.stringify()

 

이제 object를 JSON 문자열로 변환하는 방법을 알아봅시다.

 

 

let car1 = {name:"소나타", brand:"현대"};

car1변수에 오브젝트를 저장해줍니다.

 

 

 let result9 = JSON.stringify(car1);

JSON.stringify을 사용하여 JSON 문자열로 변환할 수 있습니다.

 

 

result9
>> '{"name":"소나타","brand":"현대"}'

JSON 문자열로 변환된 것을 볼 수 있습니다.