JSON은 JavaScript Object Notation의 약자로 데이터를 저장하는 방법입니다. JSON 객체에서 값은 키라는 레이블에 매핑됩니다. JSON 객체는 문자열, 정수 및 기타 JSON 값을 포함한 모든 데이터 유형을 저장할 수 있습니다.
JSON은 데이터를 저장하고 공유할 수 있는 표준 파일 형식입니다. JavaScript, Python 및 PHP와 같은 프로그래밍 언어는 모두 JSON 데이터 조작 및 읽기를 지원합니다.
이 가이드에서는 JavaScript JSON을 사용하는 방법을 살펴보겠습니다. JSON 형식의 기본 사항과 JSON 개체가 JavaScript 개체와 어떻게 비교되는지 살펴보겠습니다.
JSON이란 무엇입니까?
JSON은 데이터를 저장하고 공유하는 방법입니다. JavaScript 개체 구문을 기반으로 합니다. 차이점은 JSON은 전적으로 텍스트를 기반으로 하는 반면 객체는 그렇지 않다는 것입니다. JSON은 JavaScript Object Notation의 약자입니다.
JSON은 JavaScript 프로그래밍 언어의 원칙을 기반으로 하지만 PHP, Java 및 Ruby와 같은 다른 많은 언어에서 사용됩니다.
JSON 데이터를 파일로 저장하거나 프로그램의 값으로 저장할 수 있습니다. 예를 들어 프로그램에 mtg_cards.json이라는 파일이 포함될 수 있습니다. Magic Gathering 카드 목록을 저장합니다. 해당 데이터를 mtg_cards라는 JavaScript 변수에 저장할 수 있습니다. .
다음은 JSON에 저장된 데이터의 구조입니다.
{
"card_name": "Black Lotus",
"status": "banned",
"card_type": "Mono Artifact"
"mana": "0"
} JSON은 키-값 쌍이라는 구조를 사용하여 데이터를 저장합니다. 키-값 쌍은 "키":"값" 구조를 사용하는 데이터 조각입니다.
참가자의 81%는 부트캠프에 참석한 후 기술 직업 전망에 대해 더 자신감을 느꼈다고 말했습니다. 지금 부트캠프에 참여하십시오.
부트캠프 졸업생은 부트캠프 시작부터 첫 직장을 찾는 데까지 6개월도 채 걸리지 않았습니다.
카드 이름 키의 예입니다. 값은 콜론의 오른쪽에 있습니다. JSON에서는 키 이름을 문자열로 저장하지만 값은 부울 또는 정수와 같은 모든 데이터 유형이 될 수 있습니다.
JSON은 종종 데이터를 보내는 API입니다. 예를 들어 Airtable 또는 Fitbit API를 사용한다고 가정해 보겠습니다. JSON 데이터 형식으로 데이터를 보내고 데이터를 읽어야 합니다.
자바스크립트 JSON 데이터에 액세스하는 방법
JavaScript에서 JSON 데이터에 액세스하려면 대괄호 또는 점 표기법을 사용할 수 있습니다. 대괄호 표기법은 JavaScript 배열에서 값을 검색하는 방법과 유사합니다. 인덱스 위치를 지정하는 대신 값을 검색하려는 키의 이름을 지정합니다.
이제 JSON 개체로 형식이 지정된 이전 개체를 고려하십시오.
var black_lotus = {
"card_name": "Black Lotus",
"status": "banned",
"card_type": "Mono Artifact",
"mana": "0"
} 이 예에서는 JSON 개체를 black_lotus 변수에 할당했습니다. . Black Lotus의 카드 유형을 알고 싶다고 가정해 보겠습니다. 이것은 트레이딩 카드 게임 Magic Gathering에서 금지된 카드입니다. .
대괄호
대괄호 표기법을 사용하여 검은 연꽃 카드의 카드 유형을 알 수 있습니다.
이 표기법을 사용하려면 값을 검색하려는 개체의 이름을 지정해야 합니다. 그런 다음 해당 값과 연결된 키의 이름을 지정합니다. 키 이름은 따옴표와 대괄호로 묶어야 합니다.
다음 코드는 Black Lotus의 카드 유형에 대한 데이터를 검색합니다.
console.log(black_lotus["card_type"])
코드 반환:모노 아티팩트 . 키 이름을 큰따옴표로 묶고 대괄호로 묶은 다음 black_lotus 변수 끝에 추가했습니다. 이렇게 하면 card_type이라는 이름으로 저장된 데이터에 액세스할 수 있습니다. .
점 표기법
점 표기법은 객체 이름 뒤에 점을 지정하여 객체에 액세스하는 곳입니다. 그런 다음 액세스하려는 값의 키 이름을 지정합니다.
점 표기법을 사용하여 Black Lotus의 카드 유형에 액세스하려면 다음 코드를 사용할 수 있습니다.
console.log(black_lotus.card_type)
코드는 "Mono Artifact"를 반환합니다.
객체의 이름을 지정했습니다(“black_lotus ") 다음에 액세스하려는 값의 키("card_type ").
JSON 변환
종종 객체로 작업할 때 객체를 JSON 문자열로 변환하거나 그 반대로 변환하고 싶을 것입니다. 이것은 웹 서버를 통해 데이터를 전송하려는 경우 일반적인 방법입니다.
JSON은 JavaScript와 같은 기술에서 조작하기 쉽습니다. 일반 문자열에서 모든 값을 추출하는 것은 매우 어려울 것입니다.
처음에는 개체를 문자열로 변환하여 서버를 통해 보낼 수 있습니다. 그런 다음 데이터를 개체처럼 취급할 수 있도록 다시 개체로 변환하고 싶을 것입니다.
객체를 JSON 문자열로 변환하려면 JSON.stringify() 함수를 사용할 수 있습니다. 이전의 Black Lotus 개체를 문자열로 변환한다고 가정합니다. 다음 코드를 사용하여 그렇게 할 수 있습니다.
var black_lotus = {
"card_name": "Black Lotus",
"status": "banned",
"card_type": "Mono Artifact",
"mana": "0"
}
var string_black_lotus = JSON.stringify(black_lotus)
console.log(string_black_lotus) 코드는 다음 JSON 텍스트를 반환합니다.
“{“card_name”:”Black Lotus”,”status”:”banned”,”card_type”:”Mono Artifact”,”mana”:”0″}” 보시다시피 JSON 데이터는 문자열입니다. JSON.parse() 메서드를 사용하여 이 문자열을 JSON 객체로 다시 변환할 수 있습니다.
var black_lotus_object = JSON.parse(string_black_lotus) console.log(black_lotus_object)
이 코드는 다음을 반환합니다.
{
"card_name": "Black Lotus",
"status": "banned",
"card_type": "Mono Artifact",
"mana": "0"
} 보시다시피 데이터는 이제 개체입니다.
JSON 대 JavaScript 개체
JSON 표기법은 JavaScript 객체를 기반으로 했습니다.
JSON은 여러 프로그래밍 언어에서 지원되도록 설계되었기 때문에 JavaScript 객체와 정확히 동일하지 않습니다. 예를 들어 JSON은 PHP와 Python에서 지원됩니다. JSON을 지원하는 각 프로그래밍 언어에는 고유한 구현이 있습니다.
JavaScript 개체의 키는 따옴표로 묶어 저장하지 않지만 JSON 데이터의 키는 따옴표로 묶어 저장해야 합니다.
JSON 파일을 보면 모든 키가 따옴표로 묶인 것을 볼 수 있습니다. JavaScript 개체를 보면 키가 따옴표로 묶이지 않은 것을 볼 수 있습니다.
JSON 및 JavaScript 개체는 모두 키-값 구조로 데이터를 저장합니다.
결론
JavaScript는 JSON에 데이터 저장을 지원합니다. JSON은 JavaScript Object Notation의 약자로 관련 데이터를 하나의 객체에 저장하는 방법입니다. 개체의 각 값에는 키라고도 하는 자체 레이블이 있습니다.
이제 전문가처럼 JavaScript에서 JSON을 사용하는 데 필요한 지식을 갖추었습니다!
JavaScript에 대해 더 알고 싶으십니까? JavaScript 학습 방법 가이드를 확인하세요. JavaScript를 배우는 방법에 대한 최고의 팁과 초급 및 중급 개발자를 위한 학습 리소스 목록을 찾을 수 있습니다.