517 수업 판서 내용
[], {}, ()
대괄호 []
1. list 나열 혹은 list 인덱스 지정
ex) list[0], list[1]
중괄호 {}
1. dictionary 만들때 {'key':'value'}
2. style tag 지정 시
3. 특정 function에 대해 정의 할 때 function test(){} 형식이 되겠죠..
4. for / if 등의 문법 상 필요할 때
소괄호 ()
1. for나 if 같은 문법에 조건 식 넣을 때
JSON (Javascript Object Notation)
데이터를 저장하거나 전송할 때 많이 사용되는 "경량" Data 교환 형식
쉽게 말해서 javascript에서 객체를 만들 때 사용하는 표현식을 의미
-- 사람 기계 모두 이해하기 쉬우며 용량이 작아서 데이터 전송에 많이 쓰이고 있음
json은 데이터 포맷일 뿐
-- 어떠한 통신 방법도, 프로그래밍 문법도 아닌 단순히 데이터를 표시하는 표현 방법
Extensible Markup Language(XML)
- 데이터 값 양쪽에 태그가 있어요..
<student>
<name> kimcoding </name>
<age> 10 </age>
</student>
json 문법
-- 위에 처럼 태그로 표현하기 보다는 중괄호({}) 같은 형식으로 하고, 값을 ','로 나열한다
{
"student": [
{
"name": "kimcoding",
"age": "10"
},
{
"name": "parkstates",
"age": "15"
}
]
}
fetch 에서
json.parse(데이터)
데이터.parse() 차이
- fetch 는 js에서 기본적으로 제공하는 일종의 문법 같은 거임
- fetch 를 사용하면 두 단계를 거치게 되는데 1. 해당 url로 요청을 보내고 2. 그 뒤에 오는 응답에 대해 json() 을 해서 사용할 수 있게 된다.
- 데이터 전체를 받는데에 시간 소요 그 동안 promise 형태로 데이터 전부 다 받는 거 기다리면서 파싱해서 사용하는
fetch 에서 지원하는 문법 으로 생각하면 된다.
-- 여기서 받아온 데이터는 스트림 형태..여서 데이터가 완전히 다 받아진 상태가 아님. json()은 이 스트림을 가져와 스트림이 완료될 때까지 읽을 수 있도록 해주는 일종의 방법
json.parse() 형식이랑 유사해보이지만 fetch 에서는 .parse() 로 사용하는 걸로 생각하면 될 거 같고
json.parse() 로 사용하는 건 나중에~~ axios 라는 다른 api 받는 라이브러리를 사용하게 되면.. 그때 사용하면 될 것 같다.
fetch("./data.json")//json파일 읽어오기
.then((response) => response.json())//읽어온 데이터를 json으로 변환
.then((json) => {
data = json.items;//json에 있는 items만 받아오기
});