잘 정리해보자
Promise 쓰기 (비동기 통신 시 사용) 본문
Promise()
: 비동기 통신에 사용되며, 통신 후 callback 들을 받은 후 모든 콜백을 받은 시점을 캐치하는 것.
-> 콜백 콜백 콜백 ... 대신 쓸 수 있다.
예제 :
function promise1(){
return new Promise(function(resolve,reject){
setTimeout(function(){
console.log('promise1');
resolve();
},100);
});
}
function promise2(){
return new Promise(function(resolve,reject){
setTimeout(function(){
console.log('promise2');
resolve();
},200);
});
}
function promise3(){
return new Promise(function(resolve,reject){
setTimeout(function(){
console.log('promise3');
resolve();
},300);
});
}
//promise1,2,3을 호출하고 callback받는 Promise.all()
Promise.all([promise1(), promise2(),promise3()]).then(function () {
console.log("end");
});
각각의 promise 함수에서 resolve()로 비동기 작업이 끝났다는 것을 알려주고,
Promise를 동작시키는 Promise.all() 에서 각 함수들의 resolve를 캐치해 .then()을 실행한다.
- resolve()는 성공 시, 결과
- reject()는 에러 시, 결과 (해당 promise가 중단된 상태)
▶ promise는 resolve, reject 가 실행되기 전까지는 해당 promise는 계속 실행되고 있다.
결과 :
promise1
promise2
promise3
end
하나의 promise만 실행시키고 싶을 때는 promise함수명만 호출하고 .then() 실행.
...
promise1().then(function(){
console.log('end');
});
promise callback시, 파라미터 전달하는 경우
function promise1(){
return new Promise(function(resolve,reject){
setTimeout(function(){
console.log('promise1');
resolve('test message');
},100);
});
}
promise1().then(function(value){
console.log('end');
console.log(value);
});
resolve('test message') 라고 실행시키면 promise를 실행시킨 then의 function에서 파라미터를 받아 사용할 수 있다.
실행결과 :
end
test message
> 콘솔에 value가 찍힘 (value = 'test message')
'javascript' 카테고리의 다른 글
let, const 선언 (0) | 2021.04.11 |
---|---|
'use strict'; 사용 (0) | 2021.04.11 |
Lint (린트) (0) | 2021.04.11 |
Babel (바벨) (0) | 2021.04.11 |
웹펙 - 로더 (loader) (0) | 2021.04.10 |
Comments