동기, 비동기

INTRO.

동기란 무엇이고 비동기란 무엇인가.

쉽게생각해서, 클라이언트가 서버에 무엇인가 요청을 해서 받아오는 시간에, 동기는 서버에서 받아오는 시간까지 기다리는 반면, 비동기는 받아오는 시간동안 무엇인가를 처리한다 라고 생각하면 되겠다.

PROMISE

Javascript 에서 제공하는, 비동기를 간편하게 처리할수있도록 도와주는 'object' 이다.

기능을 수행이 성공되었다면, 성공의 메시지와 함께 처리된 결과값을 return 해준다.

이와 반대로, 기능을 수행하다 예상치 못한 무제가 발생했다면, 'Error' 를 전달해준다.

"Promise 의 포인트 2가지"

1. Terminology

pending: promise가 수행중일때 
resolve (fulfilled): 성공적으로 수행되었을때 
reject: 파일을 찾을수 없거나 거부될때

2. Producer vs Consumer

producer 와 consumer 의 차이점을 잘 이해해야한다.
정보를 제공하는 producer 와 소비하는 consumer 의 견해를 이해하는것.

• Producer: 원하는 기능을 비 동기적으로 실행하는 promise 를 생성 (시간이 좀 걸리는 것들은 비동기적으로 처리하는게 좋다)

const promise = new Promise((resolve, reject) => {
  console.log('doing something...');
})
let promise = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('성공!');
      reject(new Error('reason'));
    }, 2000); 
  })

• 유의 사항: 사용자가 버튼을 눌렀을때 네트워크를 요청해야하는 경우, 사용자가 원하지 않는데도 불구하고 network 를 사용하기떄문에 유의해야한다. 간과하고 넘어갔다간, 불필요한 network 를 사용할수도 있다. (when new promise is created, the executor runs automatically)

• Consumers : then, catch, finally

promise
  .then((value) => {
  console.log('value'); // callback 을 실행.
  .catch(error => {
  console.log(error);   // error 발생시 .catch를 이용하여 error handling을 해줘야한다.
  .finally(() => console.log('finally'))   // 성공하든 실패하든 finally를 통해 결과값을 얻을수있음. 새로 추가된 기능.
  })
})

Promise chain

const fetchNumber = new Promise((resolve, reject) => {
  setTimeOut(() => result(1), 1000);
})
fetchNumber
.then(num => num * 2)
.then(num => num * 3)
.then(num => {
  return new Promise((resolve, reject) => {
    setTImeOut(() => resolve(num-1), 1000)
  })
})