231031 TIL) 동기(Sync) & 비동기(Async) promise

1. 동기(Sync) & 비동기(Async)

자바스크립트는 비동기로 실행된다. 비동기란 실행된 순서 상관없이 결과가 나오는 것이다.

그리고 non-blockig model이라는 특징도 있다. blockig model은 코드실행 끝나기 전까지 제어권을 넘기지 않는다. 그러나 non-blockig model은 코드 실행이 끝나지 않아도 실행 제어권을 다른 곳에 넘겨서 다음코드가 실행되게 한다. 

즉, non-blockig model 환경이어야 비동기 처리가 가능해진다. 더 효율적인 방식이라 빠른 처리가 가능해진다.

 

 

 

2. promise

비동기처리를 동기적인 것처럼 처리하도록 도와주는 객체 유형.

 

생성자 인터페이스 : executor 에는 함수만 올 수 있고 인자로 resolve, reject가 주입된다. 

executor : promise의 실행함수, promise가 만들어질때 자동으로 실행된다. 연산종료와 상관없이

resolve, reject 중 하나를 무조건 호출해야 함.

상태:

대기 pending : 이행하거나 거부되지 않은 초기 상태

이행 fulfilled : 연산이 성공적으로 완료됨

거부 rejected : 연산 실패

 

promise는 동기적으로 만들어주는 객체 유형이다. 원래라면 setTimeout 함수로 1초를 기다리게 되면 비동기적으로 밑에 있는 값들이 먼저 나오는데 promise를 걸면 1초가 걸려도 기다려주는 약속을 한다. 에러 throw 되거나 reject가 실행되면  catch 메서드에 작성한다.

 

 

 

3. 비동기 함수 (Async Function)

비동기함수의 결과값은 항상 promise 객체로 resolve 됨

비동기함수 안에서만 await 연산자 사용 가능. await 연산자를 쓰면 문법이 훨씬 간결해짐.

 

// 비동기 + 일반 함수
async function 함수이름() {
	// 명령문
}

// 비동기 + 익명 함수
async function() {
  // 명령문
}

// 비동기 + 화살표 함수
async () => {
	// 명령문
}

 

 

await 연산자

사용하면 promise가 fulfilled상태나 rejected될때까지 함수실행을 중단하고 기다릴 수 있음. promise 연산 끝나면 함수에서 반환한 값을 얻음.

 

인터페이스:

const result = await 값;

 

---

회고

비동기함수의 await 연산자는 좀더 공부가 필요할 것 같다. 그래도 비동기 개념 관련해서 짚고 넘어갈 수 있어서 좋았다.