TIL_21.01.07(목) - 비동기, 서버호출

비동기 호출

• blocking(하던일을 멈추고) -> synchronous(요청에 대한 결과가 동시에)
• non-blocking(확인 후, 나중에) -> asynchronous(요청에 대한 결과가 동시에 일어나지 않음)

타이머 API

setTimeout(callback, millisecond)
일정 시간 후에 함수를 실행
return value는 임의의 타이머 ID

console.log(1);
setTimeout(function() { console.log(2); }, 6000);
setTimeout(function() { console.log(3); }, 0);
console.log(4);

// 1
// 4
// 3
// 2

setInterval(callback, millisecond)
일정 시간의 간격을 가지고 함수를 반복적으로 실행
return value는 임의의 타이머 ID

clearInterval(timerId)
반복 실행중인 타이머를 종료
return value 없음

서버 요청하기

프론트에서 서버에게 어떻게 요청하는지.
일반적으로 HTTP(URL) 요청 후, 응답을 처리한다.
응답은 다양한 형태로 받을 수 있음(JSON, HTML, plain text 등)

HTTP요청은 fetch API로
https://koreanjson.com/을 통해 간단히 확인해 볼 수 있음

fetch('https://koreanjson.com/users/1')
.then(function(res){
  return res.json();
})
.then(function(json){
  console.log(json);
})

// Promise {<pending>}

// {id: 1, name: "이정도", username: "jd1386", email: "lee.jungdo@gmail.com", phone: "010-3192-2910", …}

API는 서비스 제공자로 부터 권한을 받아야 한다.
API Key는 암호처럼 취급되어야 한다.
openWhether에서 실습함. api키를 발급 받아서 fetch를 실행

fetch('http://api.openweathermap.org/data/2.5/weather?q=Seoul&appid={API키}')
.then(function(res){
  return res.json();
})
.then(function(json){
  console.log(json.main.temp - 273.15)
})

함수 메소드

공부하면서 기존에 this와 함께 작성했던 것에서 분리하여 새로 블로깅을 진행하였다. 오랜만에... 진짜 오랜만이네... ㅜㅜ
JavaScript - function Method

내일 dom 복습과 함께 pre 모두 복습 끝내고 다음주엔 본격적으로 서버공부 다시 시작하면서 im 복습 시작하기