[LearningJS] 비동기적 프로그래밍 (콜백 + 프라미스 + 제너레이터)
비동기적 프로그래밍
- 자바스크립트 애플리케이션은 단일 스레드에서 동작한다.
- 비동기적 프로그래밍 패러다임
- 콜백, 프라미스, 제너레이터 (모두 콜백을 기반으로 한다.)
- 비동기적 테크닉을 사용하는 경우
- Ajax 호출을 비롯한 네트워크 요청
- 파일을 읽고 쓰는 등의 파일 시스템 작업
- 의도적으로 시간 지연을 사용하는 기능 (알람 등)
1. 콜백 (Callback)
- 나중에 호출할 함수
- 콜백은 다른 함수에 넘기거나 객체의 프로퍼티로 사용하거나 배열에 넣어서 사용한다.
- 콜백은 보통 익명함수로 사용한다.
setTimeout()
- 콜백의 실행을 지정된 밀리초만큼 지연하는 내장함수
setInterval()
- 콜백을 정해진 주기마다 호출하며
clearInterval()을 사용할 때까지 멈추지 않는다.
- 콜백은 어느 스코프에서 선언됐는지가 중요하다. 콜백은 자신을 선언한 스코프(클로저)에 있는 것에 접근할 수 있다.
- 오류 우선 콜백 (error-first callback) : 콜백과 관련된 에러를 처리하는 표준 방법
- 콜백의 첫번째 매개변수에 에러 객체(
err)를 쓴다.
- 콜백에서 가장 먼저 하는 일은
err이 true 인지 확인하는 것이다.
- 콜백 헬 (callback hell) : 콜백이 콜백을 호출하는 중첩된 콜백
- 콜백 헬 안에서 예외처리를 할 때에는 try/catch 블록이 같은 함수 안에서만 동작함을 기억해야 한다.
2. 프라미스 (Promise)
- 콜백을 예측 가능한 패턴으로 사용할 수 있게 한다.
- 프라미스 기반 비동기적 함수를 호출하면 그 함수는
Promise 인스턴스 를 반환한다.
- 프라미스는 성공과 실패의 두 가지 경우만 존재한다.
- 프라미스는 객체이므로 어디든 전달할 수 있다.
- 프라미스 만들기
- 성공(
resolve)과 실패(reject) 콜백이 있는 함수로 새 Promise 인스턴스를 만든다.
resolve나 reject를 여러번 호출해도 첫번째로 호출한 것만 의미가 있다.
- 프라미스 사용
- 반환된 프라미스를 변수에 할당하거나, 할당하지 않고 바로
.then() 핸들러를 호출한다.
.then() 핸들러는 성공 콜백과 에러 콜백을 받는다.- 프라미스는
.catch() 핸들러도 지원하므로 then과 catch 핸들러를 함께 사용해도 되고 나눠서 사용해도 된다.
resolve나 reject는 호출되어도 함수를 멈추지 않는다. 이것들은 프라미스의 상태만 관리한다.
- 이벤트
- 프라미스 체인
- 프라미스가 완료되면 다른 프라미스를 반환하는 함수를 즉시 호출할 수 있다.
- 체인 어디에서든 에러가 생기면 체인 전체가 멈추고
.catch() 핸들러가 동작한다. 그렇기 때문에 모든 단계에서 에러를 캐치할 필요가 없다.
- 결정되지 않는 프라미스 방지
- 성공 or 실패로 결정되지 않은 프라미스를 방지하는 방법은 프라미스에 타임아웃을 걸어서 자동으로 실패하게 만드는 것이다.
3. 제너레이터 (Generator)
- 함수와 호출자 사이의 양방향 통신을 가능하게 한다. (동기적으로)
- grun(generator run)
- 제너레이터와의 통신을 관리하고 비동기적 호출을 처리하는 함수.
- grun에 제너레이터 함수를 넘기면 해당 함수가 실행된다.
Promise.all() 메소드
- 배열로 받은 프라미스가 모두 완료될 때 완료되며, 가능하다면 비동기적 코드를 동시에 실행한다.
- 예외처리
- 제너레이터에서 실행기는 비동기적으로 실행하면서도 동기적인 동작 방식을 유지하기 때문에
try/catch 문과 함께 쓸 수 있다.
- 콜백에서 일으킨 예외는 콜백 밖에서 캐치할 수 없기 때문에 예외처리가 어렵다.
댓글남기기