callback, promise, async/await
callback
콜백함수는 다른 함수의 매개변수를 통해 함수의 내부로 전달되는 것을 콜백 함수 라고한다.
함수 외부에서 콜백 함수를 전달 받는함수를 고차함수 라고한다. 고차함수가 호출될때마다 콜백함수 생성.
콜백함수는 비동기 처리를 위해 주로 사용되지만, 배열에도 사용된다.
- 배열
- .map()
- .filter()
- .reduce()
//함수 외부에서 매개변수로 n과 , func 이라는 콜백함수를 전달받아 고차함수라고 할 수 있다.
function higherFunc(n, func) {
for (let i = 0; i < n; i++) {
func(i);
}
}
higherFunc의 매개변수를 통하여 내부로 전달되는 함수 이기때문에 콜백함수.
function callback1(num) {
console.log(num);
}
higherFunc의 매개변수를 통하여 내부로 전달되는 함수 이기때문에 콜백함수.
function callback2(num) {
if (num % 2 !== 0) {
console.log(num);
}
}
// 인자로 값과, 콜백함수를 갖고있다.
higherFunc(10, callback1);
higherFunc(10, callback2);promise
비동기처리를 할때 콜백함수가 사용되지만 콜백 헬로 인해 가독성이 나쁘고 처리하는데 한계가있다.
이를 보완하기 위해서 ES6에 promise를 도입했는데 비동기 후속 처리를 then() 을 통하여 명확하게 알 수 있다.
promise는 ES6에 빌트인된 객체이며 promise는 비동기 처리를 수행할 두개의 콜백 함수를 받는다. resolve 와 reject 함수를 받는다.
콜백함수인 resolve와 reject가 비동기 처리를 수행한다. 비동기 처리가 성공하면 resolve를 호출하고 실패하면 reject를 호출한다.
promise 에는 세가지의 상태를 가지고있는데 pending, fulfilled, 그리고 rejected 이다. pedning은 비동기 처리가 아직 수행되지 않은상태
fulfille는 비동기 처리가 성공, rejected는 비동기 처리가 실패할 경우이다.
promise 비동기 처리가 성공하면 후속처리를 then 으로 하는데 then method는 resolve 또는 rejected 콜백함수를 인수로 받고 언제나 promise를 반환한다.
async/await
코드 블록 (함수) 를 일시 중시했다가 필요한 시점에 재개할수 있다.
ES8 전에는 비동기 처리 함수를 동기 처럼 사용하기 위해서는 제너레이터 함수를 사용했는데 ES8 이후에는 가독성과 편리성을 위해서 async/await가 도입되었다. async/await는 프로미스를 기반으로 동작한다. promise는 후속처리를 then/catch method를 통해서 했지만 async/await는 promise 처럼 후속처리를 하지않고 동기 처리처럼 사용할수있다. 한마디로 async/await 는 promise의 then/catch method 없이 promise처럼 사용할 수 있다.
-
async 함수
await은 async 함수 내부에서 사용되어야한다. async 함수는 언제나 프로미스를 반환함으로 다른 인스턴스를 반환하는 곳에서는 asyncf를 사용할 수 없다.async function test(){ const wait = await fetch(url); }
비동기함수 에러처리
try...catch...finally 를 사용해서 error가 나왔을때 catch로 잡을수 있다.
finally 코드 블록은 에러발생관은 상관없이 무조건 한번 실행된다.
