기록
생활코딩 - Ajax 본문
*
브라우저는 ajax를 통해 웹서버와 통신함.
ajax를 통해 필요한 정보만 부분적으로 가져오기
*
각각의 페이지가 모두 html코드를 가질 필요는 없다.
정적/동적(바뀔 수 있는 부분)인 부분을 분류해서 동적인 부분엔 ajax를 연결해서 서버로부터 동적으로 가져옴
그렇게 하면 index.html 하나로 관리하기 편함 = SPA(하나의 페이지로 여러정보들을 표현할 수 있는 어플리케이션)
*
ajax를 구현하는 여러가지 기술 중, 최신 방법인 fetch API
fetch( ) -> 서버에 ( )을 요청
그런데, 서버가 응답하는데 시간이 많이 걸릴 수 있음. 그래서 서버가 응답할 때까지 다른 일을 함.
.then() : 응답이 끝나면 ( )안의 일을 함. 웹 브라우저가 응답받는게 끝나면 then() 의 ( ) 안의 일을 호출.
이게 바로 비동기.
특정 로직의 실행이 끝날 때까지 기다려주지 않고 나머지 코드를 먼저 실행하는 것.
그리고
then에 콜백함수를 주게 되면 fetch API가 콜백함수를 실행시킬 때
그 콜백함수의 첫번째 인자의 값으로 response 객체를 줌
fetch를 통해서 요청을 했을 때 웹서버가 응답한 그 결과를 담고 있는 것 = response
fetch( url )을 해서 url을 서버에 요청하고
응답이 끝나면 then( ) 안에 있는 콜백함수를 실행하는데. 그 콜백함수에 첫번째 인자로 response 객체가 있고
그 객체 안에 우리가 요청한 url의 결과값이 담겨있음
그래서 .then(response => response.json(); ) 이런 코드를 짜는구나
'JS > etc' 카테고리의 다른 글
프로토타입 등 (0) | 2020.12.29 |
---|---|
arguments (0) | 2020.12.29 |
DOM (0) | 2020.12.14 |
프로그래머스 - 자바스크립트 (0) | 2020.08.30 |
dongpani - JavascriptConcepts (0) | 2020.08.10 |