JSON은(는) JavaScript Object Notation의 약자입니다. 이것은 JavaScript 객체를 설명하는 데 사용됩니다. 이는 키-값 쌍을 사용하여 데이터 값을 지정하는 데이터 공유 형식입니다. JSON 객체는 모든 주요 브라우저에서 지원됩니다. 이 튜토리얼은 JavaScript와 JSON 객체 작업에 익숙해야 합니다. JSON에 익숙해지려면 다음을 살펴보십시오. JSON 데이터 공유 형식 개요. 또한 다음 방법을 확인할 수도 있습니다: JavaScript에서 JSON 작업하기.
JSON 형식은 네트워크를 통해 데이터를 전송하는 데도 사용됩니다. 이를 위해 데이터를 직렬화 및 역직렬화해야 합니다. 데이터가 JSON 형식인 경우 다음을 사용하여 문자열로 변환됩니다. stringify 메서드. 조작을 위해 데이터를 다시 객체 형식으로 변환하려면 parse 메서드가 사용됩니다. 이 튜토리얼에서는 다음의 사용 단계를 살펴볼 것입니다: JSON.parse() 및 JSON.stringify(). 시작해 봅시다!
JSON.parse()
이 메서드는 JSON 문자열을 프로그래밍 방식으로 조작할 수 있도록 JSON 객체로 변환하는 데 사용됩니다. 전달되는 문자열은 유효한 JSON 문자열이어야 하며, 그렇지 않으면 예외가 발생합니다. 이 문자열은 모든 웹 서비스 또는 원격 애플리케이션에서 수신할 수 있습니다.
이 메서드는 두 개의 매개변수를 허용합니다: 문자열 및 콜백 함수. 이 함수는 문자열을 객체로 변환하기 전에 조작하는 데 사용할 수 있습니다. 웹 서비스로부터 작업 상태, 메시지 및 상태 코드를 나타내는 메시지를 수신한다고 가정해 보겠습니다. 아래는 문자열을 객체로 변환하는 간단한 예입니다.
코드:
|
1 2 3 |
let json_string = '{"message":"Done with success", "status":200, "code":200}' let server_obj = JSON.parse(json_string); console.log(server_obj) |
출력:
|
1 |
{message: 'Done with success', status: 200, code: 200} |
흔히 발생하는 문제는 문자열 끝에 쉼표가 추가되는 경우이며, 이로 인해 JSON.parse()에 전달된 문자열에 끝에 쉼표가 있으면 오류가 발생합니다. 값을 조작해야 하는 경우 콜백함수를 두 번째 인수로 전달할 수 있습니다.
코드:
|
1 2 3 4 5 6 7 8 9 |
let string = '{"name":"XYZ","email":"xyz@example.com"}'; let obj = JSON.parse(string, (key, value) => { if (typeof value === 'string') { return value.toUpperCase(); } return value; }); console.log(obj) |
출력:
|
1 |
{name: 'XYZ', email: 'XYZ@EXAMPLE.COM'} |
JSON.stringify()
The stringify 메서드는 parse 메서드와 정확히 반대되는 작업을 수행합니다. 여기서는 JSON 객체가 전달되고 반환 값은 문자열입니다. 예를 들어 이 문자열을 다른 원격 웹 서비스로 전달한 다음 조작을 위해 다시 JSON 객체로 파싱할 수 있습니다.
코드:
|
1 2 3 |
let obj = {message:"Done with success", status:200, code:200} let str = JSON.stringify(obj); console.log(str); |
출력:
|
1 |
{"message":"Done with success","status":200,"code":200} |
stringify 메서드는 두 개의 인수를 취할 수 있습니다: replacer및 spacer 메서드. replacer 메서드는 문자열의 값을 대체하거나 제외하는 데 사용할 수 있습니다.
코드:
|
1 2 3 4 5 6 7 8 9 |
let obj = {message:"Done with success", status:200, code:200} let str = JSON.stringify(obj, (key, value) => { if (status === 200) { return undefined; } return value; }); console.log(str) |
출력:
|
1 |
{"message":"성공적으로 완료됨","status":200,"code":200} |
When the spacer 인수가 제공되면, 배열이나 객체의 각 요소는 해당 줄에 배치되고 객체 및 배열의 계층 구조에서 깊이를 나타내도록 들여쓰기됩니다. 아래는 이를 설명하는 간단한 코드 스니펫입니다.
코드:
|
1 2 3 |
let obj = {message:"성공적으로 완료됨", status:200, code:200} let str = JSON.stringify(obj, null, "---"); console.log(str) |
출력:
|
1 2 3 4 5 |
{ ---"message": "성공적으로 완료됨", ---"status": 200, ---"code": 200 } |
결론
이 튜토리얼에서는 JSON 형식의 콘텐츠를 다루는 데 도움이 되는 두 가지 메서드를 살펴보았습니다. JSON 객체는 어디에나 있으며 JavaScript를 사용하여 현대적인 애플리케이션을 빌드할 때 이러한 메서드는 매우 유용합니다. 자세한 내용은 다음에서 제공하는 튜토리얼을 확인해 보세요: 우리 블로그:
즐거운 컴퓨팅 되세요!
댓글
아직 댓글이 없습니다. 첫 번째로 작성해 보세요.