티스토리 뷰
오늘은 이어서 JSON과 친해지기 2탄! 을 포스팅을 해보겠습니다.
JSON은 다른 언어들과도 비슷하게 String, Number, Object, Array, Boolean 그리고 null 값으로 구성되어 있습니다.
JSON Object(객체) 기본구조 – ‘name-value’ 형식의 쌍
var person = {
"name" : "Jason",
"birth" : "88-12-02",
"nation" : "Korea",
}
JSON 객체의 기본구조 형태는 비순서화된 set으로 이루어져 있습니다.
이를 표현하는 방식은 중괄호 {}로 시작하고 끝내며, 이 중괄호 안에 key(name)과 value를 콜론(:)으로 묶어 하나의 쌍을 만듭니다. 각각의 쌍은 콤마(,)로 구분합니다.
여담으로, 파이썬의 딕셔너리와 거의 흡사한 구조이며 다루는 방식도 같습니다!
객체 안에 배열을 다음과 같이 value 값으로 넣어 줄 수도 있습니다.
JSON Array(배열)구조는 여러개의 {key:value} 값을 가집니다.
var myinfo = {
"firstName" : "Oh",
"lastName" : "Jason",
"email" : "jason@java.script",
"fav-fruit" : ["banana","pineapple"],
}
JSON의 변환 방법에는 크게 두 가지가 있습니다.
바로 stringify(); 함수와 parse(); 함수입니다.
stringify(); 함수는 JSON 객체를 String 타입의 객체로 변환을 시켜주는 함수입니다.
아래 예시를 보면, JSON 객체에서 " [ " 하나까지 나누어져 있는 String 객체로 변환된 것을 볼 수 있습니다.
그리고 또 한 가지! 함수뿐만 아니라, 자바스크립트에만 있는 (symbol과 같은..) 특별한 데이터는 JSON에 포함되지 않는 것을 볼 수 있습니다.
JSON으로 변환되는 것을 내가 원하는 부분만 변환하고 싶다면,
Replacer 코멘트처럼 함수 형태로 전달해도 되고 배열 형태로 전달해도 됩니다.
동작 방식은 예시를 들어보자면,
cat objec에서 이름만 JSON으로 전달하고 싶다면 다음과 같이 배열에 프로퍼티 이름만 전달하게 되면 이름만 포함되어 나오게 됩니다.
이렇게 내가 원하는 프로퍼티만 골라서 정의를 하게 되면 해당하는 프로퍼티만 JSON으로 전환이 됩니다.
그리고 콜백 함수를 이용해서 조금 더 세밀하게 통제를 할 수 있습니다.
다음과 같은 방식을 통해 key와 value를 전달받아서 콜백 함수로 전달하게 되면 key과 value에 따라서 좀 더 다양하게 해 볼 수가 있습니다.
결과를 보면 >> 모든 key와 value들이 콜백 함수를 통해 전달되는 것을 볼 수 있습니다.
여기서 독특한 점은 제일 처음으로 전달되는 것은 cat의 object를 싸고 있는 제일 최상의 것이 전달이 되고
그 뒤부터 key와 value들이 전달되는 것을 알 수 있습니다.
한 가지 포인트는 cat이라는 object에는 scratch라는 함수가 있었는데 변환한 obj는 직렬화가 된 즉, String으로 만들어진 JSON으로부터 다시 obj를 만들었기 때문에 함수는 직렬화가 될 때 포함되어 있지 않습니다.
그렇기 때문에 스크래치라는 API가 없습니다.
'코딩 일기 > 랩실스터디' 카테고리의 다른 글
내 이름은 Vue.js! 내 장점은 말이야~ [스마트인재개발원] (0) | 2021.08.01 |
---|---|
내 이름은 Vue.js! 나를 소개하지! [스마트인재개발원] (0) | 2021.07.25 |
AJAX 그것이 알고싶다! (2) [스마트인재개발원] (0) | 2021.07.25 |
AJAX 그것이 알고싶다! (1) [스마트인재개발원] (0) | 2021.07.09 |
JSON과 친해지기(1) [스마트인재개발원] (0) | 2021.06.25 |
- Total
- Today
- Yesterday
- Python
- JavaScript
- Java
- 3계층구조
- 국비지원코딩교육
- 최종프로젝트
- Vue.js
- 야너두할수있어코딩
- 자바
- 스마트인재개발원
- Vue
- 코딩
- Ajax
- 데이터계층구조
- 야너두할수있어
- 스마트인재캠퍼스
- 뷰
- 스마트미디어캠퍼스
- 광주코딩교육
- 비동기
- 스마트미디어인재개발원
- JSON
- 랩실
- 머신러닝
- IoT
- 지도학습모델
- 야너두코딩할수있어
- 개발도구
- 랩실스터디
- 발표
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |