- 비동기 발생
⇒ 실행되는 코드가 기다려야 하는 시간이 필요하다는 의미
즉, 일단 이전 시간이 오래 걸리면, 안 기다려주고(알아서 처리하도록 냅둠) 다음 코드를 무작정 실행함
ex) setTimeOut(), setInterval(), query() 등등..
- 비동기 처리
⇒ 비동기가 필요 없을 때가 있음
즉, 이전 코드들의 시간을 다 기다려주며, 순서를 맞춰서 코드를 실행시줌
Promise 함수
// 비동기 처리 "Promise"
let promise = new Promise(function (resolve, reject) {
// executor : 이 promise가 할 일
setTimeout(() => resolve("완료!"), 3000);
// 할 일을 다 하면 무조건 콜백 함수를 호출함( resolve(). reject() )
// 할 일을 성공적으로 하면 resolve(결과), 실패하면 reject(에러)
});
// promise의 기본 메소드 : promise가 일 다 끝내고 호출하는 함수
promise.then(
function (result) {
console.log(result);
},
function (error) { }
);
async-await 함수
// async 함수
// function f() { } : 일반 함수
// async function f() { } : async 함수
async function f() {
return Promise.resolve(7);
// return 7; 이랑 같은 결과를 가짐
// async 첫 번째 기능 => async 함수는 무조건 Promise 객체를 반환
// -> 만약 반환값이 Promise가 아니면 promise.resolve()
}
f().then(
function(result) {
console.log("Promise resolve : " , result);
},
function(error) {
console.log("Promise reject : " , error);
}
)
// async의 두 번째 기능
// promise 객체가 일이 끝날 때 까지 기다릴 수 있는 공간을 제공해줌
async function f() {
let promise1 = new Promise(function(resolve, reject) {
setTimeout(() => resolve("첫 번째 promise!"), 3000);
});
let result1 = await promise1;
// promise 객체가 일 다 할 때 까지 기다려줌
console.log(result1);
let promise2 = new Promise(function(resolve, reject) {
setTimeout(() => resolve("두 번째 promise!! " + result1), 3000);
});
let result2 = await promise2
console.log(result2);
let promise3 = new Promise(function(resolve, reject) {
setTimeout(() => resolve("세 번째 promise!!! " + result2), 3000);
});
let result3 = await promise3
console.log(result3);
}
f();