[JavaScript] JSON

JSON (JavaScript Object Notation)

JSON은 XML 보다 더 가볍게 데이터를 교환하고 저장하기 위하여 만들어진 텍스트 기반의 데이터 교환 표준이다.

01. JSON 특징

• JSON은 자바스크립트를 확장하여 만들어졌다. 그래서 객체 표기 방식도 자바스크립트를 따른다.
• JSON은 데이터를 전달하기위해서 만들어졌지만 사람도 쉽게 읽을 수 있다.
• JSON은 프로그래밍 언어와 운영체제에 독립적이다.

02. JSON 구조

JSON 데이터는 이름(Key)과 값(value)으로 되어있다.
JSON 데이터에서 이름과 값을 나누는 것은 콜론(:)이다.

"name" : "홍길동" // KEY : value

데이터의 이름도 문자열 이므로 JavaScript 처럼 큰 따옴표("")로 감싸줘야 한다.

데이터 값으로 받아올 수 있는 타입이다.

• 숫자형 (number) // 1,2,3
• 문자형 (string) // "글자"
• 자료형 (boolean) // true , false
• 객체 (object) // let members = { id : 'bottlesun'}
• 배열 (array) // let fruits = ['사과', '바나나']
• NULL // 의도적으로 값을 주지 않을때 사용 // undefined는 JSON에서 타입을 제공하지 않음(X)

02-1. JSON의 객체

JSON을 사용할때 나열하는 방식이다.
{} 안에 KEY:value,를 입력하여 나열한다. 해당 JSON에 들어가는 KEY 와 value는 객체나 배열을 호출할때와 동일하게 사용이 가능하다.
유의 사항으로는 쉼표를(,) 사용하여, 구분을 해줘야 한다.

{
  "no" : 1,
  "name" : "이름",
  "man" : true,
}

02-2. JSON의 배열

JSON도 배열로 크게 정리하여 사용이 가능하다.
value 값을 대괄호 ([])로 크게 묶어 사용을 하면 된다.

'mamber' : [
{
  "no" : 1,
  "name" : "이름",
  "man" : true,
} ,
{
  "no" : 2,
  "name" : "이름2",
  "man" : false,
} ,
]

03. 데이터 출력 방법

그룹으로서 변수들을 정의를 하고 데이터의 접근을 하는 방법으로는 객체.하위정보(key) 로 불러 올 수있다.

const student = {
  classRoom : "1-A",
  studentNo : 1,
  name : "홍길동",
  addr : "서울특별시",
  phone : "010-1234-1234",
}

해당 학생의 JSON 정보가 있다면, student.key 로 해당 필요 정보를 가지고 올 수 있는것이다.
json의 key를 배열의 인덱스처럼 불러 올 수 있다.

console.log(student.classRoom) // 1-A
console.log(student.studentNo) // 1
console.log(student['name']) // 홍길동
console.log(student['phone']) // 010-1234-1234

해당 객체의 필요한 정보들을 불러서 출력이 가능하다.

Object.getOwnPropertyNames()

JSON KEY 데이터를 배열로 반환해주는 방법이다.
전달된 객체의 모든 속성들을 배열로 반환해주는 매서드이다.

// json의 key 배열로 반환하는 명령
const keys = Object.getOwnPropertyNames(student);
console.log(keys);