JSON(JavaScript Object Notation)은 데이터를 표현하기 위한 경량의 데이터 교환 형식입니다. 자바스크립트에서 JSON은 일반적으로 문자열 형태로 사용되며, 이를 자바스크립트 배열로 변환하는 방법에 대해 알아보겠습니다.

1. JSON.parse() 메소드 사용하기

JSON 문자열을 자바스크립트 객체로 변환하려면 JSON.parse() 메소드를 사용할 수 있습니다. 이 메소드는 JSON 문자열을 파라미터로 받아서 자바스크립트 객체로 변환합니다. 따라서 이 객체를 배열로 변환하기 위해 Object.values() 메소드를 사용할 수 있습니다.

const jsonData = '{"name": "John", "age": 30, "city": "New York"}';
const jsonObject = JSON.parse(jsonData);
const jsonArray = Object.values(jsonObject);

console.log(jsonArray);

위의 예제에서, jsonData는 JSON 형식의 문자열입니다. JSON.parse()를 사용하여 jsonData를 자바스크립트 객체로 변환한 후, Object.values()를 사용하여 객체의 값을 배열로 추출합니다. 결과적으로 jsonArray는 자바스크립트 배열 형태로 변환된 데이터를 담고 있습니다.

2. for…in 루프 사용하기

또 다른 방법은 for…in 루프를 사용하여 JSON 데이터를 배열로 변환하는 것입니다. 이 방법은 JSON 객체의 key를 순회하면서 해당 key에 대한 value를 추출하여 배열에 넣어주는 방식입니다.

const jsonData = '{"name": "John", "age": 30, "city": "New York"}';
const jsonObject = JSON.parse(jsonData);
const jsonArray = [];

for (let key in jsonObject) {
  jsonArray.push(jsonObject[key]);
}

console.log(jsonArray);

위의 예제에서, jsonData는 JSON 형식의 문자열입니다. JSON.parse()를 사용하여 jsonData를 자바스크립트 객체로 변환한 후, for…in 루프를 사용하여 객체의 각 key에 대한 값을 배열에 추가합니다. 결과적으로 jsonArray는 자바스크립트 배열 형태로 변환된 데이터를 담고 있습니다.

3. 배열화된 JSON 데이터를 디코딩하기

또 다른 방법은 배열 형태로 변환된 JSON 데이터를 디코딩하는 것입니다. 이 경우에는 decodeURIComponent() 함수를 사용하여 JSON 데이터를 디코딩하고, 이를 다시 JSON.parse() 메소드를 활용하여 자바스크립트 배열로 변환하는 것입니다.

const jsonData = '["John", 30, "New York"]';
const decodedData = decodeURIComponent(jsonData);
const jsonArray = JSON.parse(decodedData);

console.log(jsonArray);

위의 예제에서, jsonData는 JSON 배열 형식의 문자열입니다. decodeURIComponent() 함수를 사용하여 jsonData를 디코딩한 후, JSON.parse()를 사용하여 디코딩된 데이터를 자바스크립트 배열로 변환합니다. 결과적으로 jsonArray는 자바스크립트 배열 형태로 변환된 데이터를 담고 있습니다.

결론

위에서 언급한 세 가지 방법은 JSON 데이터를 자바스크립트 배열로 변환하는 가장 일반적인 방법입니다. 각각의 방법은 JSON 데이터를 배열로 변환할 때에 대하여 유연성과 편의성을 제공합니다. 필요에 따라 가장 적합한 방법을 선택하여 사용하십시오.