1. 리스트
순서를 지켜서 가지고 있는 형태
let a_list = [] // 리스트를 선언. 변수 이름은 역시 아무렇게나 가능! // 또는, let b_list = [1,2,'hey',3] // 로 선언 가능 b_list[1] // 2 를 출력 b_list[2] // 'hey'를 출력 // 리스트에 요소 넣기 b_list.push('헤이') b_list // [1, 2, "hey", 3, "헤이"] 를 출력 // 리스트의 길이 구하기 b_list.length // 5를 출력 |
2. 딕셔너리: 키(key)-밸류(value)값의 묶음
딕셔너리는 객체로도 불린다.
let a_dict = {} // 딕셔너리 선언. 변수 이름은 역시 아무렇게나 가능! // 또는, let b_dict = {'name':'Bob','age':21} // 로 선언 가능 b_dict['name'] // 'Bob'을 출력 b_dict['age'] // 21을 출력 b_dict['height'] = 180 // 딕셔너리에 키:밸류 넣기 b_dict // {name: "Bob", age: 21, height: 180}을 출력 |
3. 리스트와 딕셔너리의 조합
names = [{'name':'bob','age':20},{'name':'carry','age':38}] // names[0]['name']의 값은? 'bob' // names[1]['name']의 값은? 'carry' new_name = {'name':'john','age':7} names.push(new_name) // names의 값은? [{'name':'bob','age':20},{'name':'carry','age':38},{'name':'john','age':7}] // names[2]['name']의 값은? 'john' |
※ 딕셔너리의 자주쓰는 또 다른 표현
let b_dict = {'name':'Bob','age':21} //bob 이름을 꺼낼땐 두 가지 방식으로 깞을 꺼낼 수 있습니다. b_dict['name'] b_dict.name 둘다 똑같이 딕셔너리의 키값에 접근하여 값을 꺼내옵니다. |
4. 리스트와 딕셔너리 조합이 필요한 이유
→ 순서를 표시할 수 있고, 정보를 묶을 수 있다.
예를들어, 어떤가게에 손님이 찾아와 대기표를 작성하고 온 순서대로 "이름, 휴대폰번호" 를 저장한다고 하자.
변수만을 사용하게되면,
let customer_1_name = '김스파';
let customer_1_phone = '01012341234';
let customer_2_name = '박르탄';
let customer_2_phone = '01043214321';
알아보기가 쉽지않다.
▶딕셔너리를 활용한다면 다음과 같이 고객 별로 정보를 묶을 수 있고,
let customer_1 = {'name': '김스파', 'phone': '01012341234'};
let customer_2 = {'name': '박르탄', 'phone': '01043214321'};
▶그리고 순서를 나타내기 위해 리스트를 사용하면, 이렇게나 깔끔해진다.
let customer = [
{'name': '김스파', 'phone': '01012341234'},
{'name': '박르탄', 'phone': '01043214321'}
]
위의 모습만 봐도 깔끔해진 모습을 볼 수 있고, .push함수를 이용해서 간단하게 추가도 가능하다.
5. JSON 데이터 구조
■ 리스트와 딕셔너리가 복합적으로 존재하는 데이터 구조
예시)
서울시 Open API JSON 데이터 구조
http://openapi.seoul.go.kr:8088/6d4d776b466c656533356a4b4b5872/json/RealtimeCityAir/1/99
JSON 형태를 보다 편하게 보기위해서 크롬 확장프로그램 중, JSON View를 추가해주면된다.
https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=ko
'내마음대로만들어보자 > JS' 카테고리의 다른 글
조건문 & 반복문 (0) | 2021.08.12 |
---|---|
자바스크립트 기본 제공함수 (0) | 2021.08.12 |
e.preventDefault() 와 stopPropagation() 의 차이 (0) | 2021.06.14 |
eq() (0) | 2021.06.14 |
개념정리(Javascript) - 반복문(For in) (0) | 2021.06.03 |