[JavaScript-72] JSON.parse

자, 지난 시간에 json이 뭔지는 설명을 해뒀으니 한결 편하네요. ㅎㅎ

오늘은, json을 실제로 개발에 사용할 수 있는 형태로 변환하는 방법을 알려드리겠습니다. 

 

json파일을 처음 받아오면, 자바스크립트는 json을 놀랍게도 객체나 배열이 아닌 문자열로 인식합니다.

그래서, 이를 배열로 변환해줘야 쉽게 데이터를 사용할 수 있습니다. 

 

json데이터를 자바스크립트 배열로 변환하는 메소드는, 

JSON.parse입니다. 여기서 JSON은, json파일을 다루는 메소드들을 모아둔 내장객체입니다. 

JSON내장객체 안의 parse메소드를 쓰면, json데이터가 자바스크립트 배열이 됩니다. 

 

예제 코드를 보시죠

fetch('https://jsonplaceholder.typicode.com/users')
  .then((response) => response.text())
  .then((result) => {const userName = JSON.parse(result);});

자, 제가 fetch에 대한 설명을 드리지 않아서 코드 자체는 이해가 가지 않으실 텐데요,

fetch에 관해서는 조만간 정리해드릴거고, 아주 깊게 배울거니까

 

지금은 그냥 JSON.parse에 집중해주세요.

제가 fetch함수의 파라미터에 적어둔 url에는, json데이터가 있습니다. 

 

fetch는, 서버에 해당 url의 데이터를 달라는 요청을 보내고, 데이터를 받아오는 함수이니,

fetch함수에 전달된 url을 타고 도착한 곳에 json이 있었다면, 당연히 마지막에 result파라미터로 들어오는 데이터는

json형식이겠죠? 이녀석을 JSON.parse에 넣어서, 자바스크립트 배열로 바꿀 수 있다 이말입니다~

 

배열이 되었으니 forEach, map, find, filter, 슬라이싱, 인덱싱 등을 자유자재로 사용할 수 있겠죠?