본 내용은 드림코딩 엘리님의 강좌를 토대로 작성하였습니다.
1. callback 함수
- callback함수란 다른 코드의 인자로 넘겨받는 함수를 뜻한다.
코드를 실행하다가 특정한 때에 함수를 실행한다.
🚃 동기? 비동기?
- 동기 : A라는 일이 끝날 때까지 기다렸다가 B를 실행
- 비동기 : A라는 일이 끝나지 않아도 B를 실행
자바스크립트는 동기적 언어라 순서대로 코드가 실행된다. 그래서 setTimeout를 이용해 비동기적으로 코드를 실행할 수 있다. setTimeout(함수, ms)
2. Promise
- promise는 비동기적 코드를 실행할 때 콜백함수 대신 쓰는 오브젝트다.
🏦 state & producer & consumer
- state : 프로세스의 진행 상태
pending: 수행 중 ,fulfilled: 수행성공,rejected: 수행실패 - producer : 프로미스는 생성 시 excutor함수가 즉시 실행함
resolve: 수행 성공 시 실행할 코드,reject: 수행 실패시 실행할 코드 - consumer : 프로미스를 사용함
then: 수행 성공 시 resolve의 내용을 value로 받음
catch: 에러 발생시 처리할 내용
finally: 성공하든 실패하든 마지막에 수행
⛓ promise chaining
- promise의 연결은
then을 이용하여 계속 프로미스를 이어받을 수 있다. - fetchNumber는 최초에는 1을 받아오고 x2, x3, -1로 이어받아서 5를 리턴한다.
🛡 error handling
catch를 이용하여 최종적으로 처리하는 방법도 있고,then사이에catch를 넣어서 중간에 오류를 처리하는 방법이 있다..catch(error => {})
3. async & await
- async 는 promise를 좀 더 간단한 스타일로 사용하게 해준다.
✨ async
- function 앞에
async를 붙여주면 새로운 프로미스가 생성되므로 resolve, reject등을 쓰지 않고 간편하게 프로미스를 사용할 수 있다.
⏳await
await는 async 안에서만 쓸 수 있고 await가 붙은 수행이 끝마칠때까지 기다리게 해준다.
🪄 promise APIs
all: 코드가 동시에 병렬적으로 수행가능한 코드는all을 이용해서 한번에 수행한다.race: 여러 코드 중 먼저 실행되는 코드값을 얻고 싶을 때 이용한다.
Generalist.