JSON(JavaScript Object Notation)은 자바스크립트 객체를 문자열로 표현하는 데이터 형식입니다. 자바스크립트에서 JSON 데이터를 다룰 때, 때로는 이를 배열로 변환하여 더 쉽게 다루고자 하는 경우가 있습니다.

1. JSON 데이터

먼저, JSON 데이터의 구조를 이해해야 합니다. 예시로 아래와 같은 JSON 데이터를 사용하겠습니다:

{
  "fruits": [
    {"name": "apple", "color": "red"},
    {"name": "banana", "color": "yellow"},
    {"name": "orange", "color": "orange"}
  ]
}

위 JSON 데이터는 “fruits”라는 키에 대응하는 배열을 갖고 있습니다. 각 배열의 요소는 과일의 이름과 색깔을 표현하는 자바스크립트 객체입니다.

2. JSON 데이터를 자바스크립트 배열로 변환하기

JSON 데이터를 자바스크립트 배열로 변환하기 위해서는 다음과 같은 단계를 따를 수 있습니다:

1. JSON 데이터를 파싱하여 자바스크립트 객체로 변환합니다.
2. 변환된 자바스크립트 객체에서 필요한 배열을 추출합니다.

사용 예시:

const jsonString = `{
  "fruits": [
    {"name": "apple", "color": "red"},
    {"name": "banana", "color": "yellow"},
    {"name": "orange", "color": "orange"}
  ]
}`;

const jsonObject = JSON.parse(jsonString); // JSON 파싱

const fruitArray = jsonObject.fruits; // "fruits" 키에 대응하는 배열 추출

console.log(fruitArray);

위 예시에서 JSON.parse() 함수를 사용하여 JSON 데이터를 자바스크립트 객체로 변환합니다. 그리고 jsonObject.fruits를 통해 “fruits” 키에 대응하는 배열을 추출하여 fruitArray 변수에 할당합니다. 이제 fruitArray는 자바스크립트 배열로 사용할 수 있습니다.

출력 결과는 다음과 같습니다:

[
  {"name": "apple", "color": "red"},
  {"name": "banana", "color": "yellow"},
  {"name": "orange", "color": "orange"}
]

결론

이렇게 자바스크립트 JSON 데이터를 자바스크립트 배열로 변환하는 방법에 대해 알아보았습니다. JSON 데이터를 배열로 변환하면 데이터를 더 쉽게 다룰 수 있으며, 자바스크립트에서 다양한 처리 작업을 수행할 수 있습니다. JSON 데이터를 다룰 때는 JSON 파싱과 필요한 정보를 추출하는 과정을 이해하고 활용할 수 있도록 연습해보세요.