동기식 처리 모델(Synchronous processing model)
직렬방식. 받고 보내주고 쓰는 일을 요청했다면, 그 순서에 따라서 작업이 수행된다. 그 작업이 수행되는 도중엔 다른 작업이 실행되지 않고, 한 작업이 끝나면 그 다음 작업이 시작된다. 예를 들어 페이지를 로드할 때, 서버에서 데이터를 가져오기 전까진 다른 작업은 하지 않는다.
비동기식 처리 모델(Asynchronous processing model)
병렬방식. 위와 같은 작업을 한다면 데이터를 가져오는 것을 기다리지 않고 즉시 다음 작업을 수행한다. 그래서 데이터를 불러오지 못하는 일이 발생하기도 한다.
자바스크립트의 많은 함수가 비동기식으로 처리되기 때문에 동기적으로 해결하기 위해 async/await 를 쓴다.
async function 선언은 이름부터 알 수 있듯이 AsyncFunction과 관련이 있다. AsyncFunction은 Promise라는 값을 반환하는데, 이는 이 함수에 의해 반환된 값으로 해결되거나 함수 내에서 발생하는 예외값이다.
async 함수는 await식과 함께 쓰인다. 이 식은 async 함수의 실행을 일시중지하고 Promise 값을 기다린 후 다시 async 함수를 실행하게 하고, 그 완료된 값을 반환한다. await는 단독으로 쓰일 수 없다. (async 밖에서 쓸 시 SyntaxError!)
async 함수는 항상 promise를 반환하고, 명시적이지 않더라도 promise.라고 볼 수 있다.
async function honey() {
return 1
}
//위 코드는 아래와 같다.
async function honey() {
return Promise.resolve(1)
}
async 함수 단독으론 동기적이지만 await와 함께하면 비동기적으로 작동하게 된다고 보면 될듯~~~
Promise 객체의 세 가지 상태
* 비동기 작업이 맞이할 미래... 이렇게 쓰니까 되게 문학적이다ㅎㅎ..) 완료 또는 실패, 그 결과의 값
* promise가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자
* 이를 이용하여 비동기 작업이지만 동기 작업처럼 값을 반환할 수 있다.
* 최종 결과를 반환하는 건 아니고 미래의 어떤 시점에 결과를 제공하겠다는 약속이기 때문에 Promise
대기(Pending) : 이행하지도, 거부하지도 않은 초기 상태
이행(Fulfilled) : 성공적으로 완료됨
거부(Rejected) : 실패함
pending : 있을 때 까지, 미결인
* promise가 대기에서 벗어나 이행 또는 거부 된 것을 처리됐다(settled)고 함
* promise가 처리됐거나, 다른 promise의 상태에 맞춰 상태가 잠김된 것을 리졸브(resolved)됐다고 함
참고 사이트 : developer.mozila.org
'프론트엔드✏️ > 코드캠프' 카테고리의 다른 글
알고리즘 - 배열, 문자열 (0) | 2022.05.16 |
---|---|
try ... catch (트라이 캐치) (0) | 2022.05.15 |
Template literals(템플릿 리터럴) (0) | 2022.05.15 |
Git, GitHub (0) | 2022.05.15 |
Rest-API & Graphql-API (0) | 2022.05.15 |