[JavaScript] 자바스크립트 JSON 알아보기

2022. 7. 31. 02:47Program/JavaScript

221_자바스크립트 JSON 알아보기

[적용]

  • 네트워크로 데이터를 송수신하고 싶을 때
  • 데이터를 정의하고 싶을 때

[내용]

JSON은 범용적인 데이터 형식이다.

서버와의 통신이나 데이터의 외부 파일 저장 등에 사용한다.

JSON은 자바스크립트뿐만 아니라 PHP나 자바(Java) 등 다른 언어에서도 사용된다.

JSON은 텍스트 에디터로 편집이 가능하며, 자바스크립트로 불러오기가 쉽고

다양한 구조의 데이터도 유연하게 사용할 수 있는게 장점이다.

 

JSON 파일의 구조를 확인하기 위해 다음과 같이 각 학급 정보를 JSON 데이터로 정의한다고 가정해 보자.

학생이 40명인 4학년 C반의 정보는 다음과 같이 정의한다.

JSON                                                                                                                                JSON의 구조와 데이터의 예

{
  "students": 40,
  "grade": 4,
  "name": "C반"
}

 

JSON 데이터는 키와 값을 조합하여 정의한다.위의 코드에서는 students가 키, 40이 값이다.키는 문자열만 가능하며, 반드시 큰 따온표(" ")와 함께 표기한다.기본적으로 자바스크립트의 문법을 그대로 사용할 수 있고 값에 숫자, 문자열, 진리값, 배열, 객체가 올 수 있다.

 

배열과 객체는 구조화된 정보의 정의가 가능하다.40명의 4학년 C반과 20명의 2학년 B반이 있는 'A학교'를 정의하는 예시를 확인해 보자.JSON은 객체 내부에 객체를 넣을 수 있으므로 깊을 계층의 데이터를 정의할 수 있다.

JSON

{
  "name" : "A학교"
  "classes" : [
    {
      "students": 40,
      "grade": 4,
      "name": "C반"
    },
    {
      "students": 20,
      "grade": 2,
      "name": "B반"
    },
  ]
}

 

자바스크립트의 객체와 배열은 요소와 마지막에 콤마(,)를 허용하지만,

JSON은 에러가 발생한다.

JSON

{
  "name" : [1, 2, 3, 4]
}  // OK

{
  "name" : [1, 2, 3, 4,]
}  // ERROR

 

문자열의 정의는 큰 따옴표(" ")를 사용한다.

큰 따옴표가 없거나 작은 따옴표(' ')를 사용하면 에러가 발생한다.

JSON

{
  "name" : [1, 2, 3, 4]
}  // ERROR

{
  name: [1, 2, 3, 4];
}  // ERROR

{
  'name' : [1, 2, 3, 4]
}  // ERROR

 

 

 


 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김