프로미스는 성공/실패 판정 기계이다.
순차적으로 코드를 실행하기위해 콜백함수대신에 쓸 수 있는 패턴입니다.
var 프로미스 = new Promise(); 👉 프로미스라는 변수 오브젝트를 하나 생성
프로미스.then(function(){
👉 프로미스가 성공일 경우 실행할 코드
}).catch(function(){
});
new Promise()
: Promise라는 변수 오브젝트를 하나 생성
프로미스라는 변수에다가 then()
을 붙여서 실행
프로미스 안의 코드가 실행이 완료가 되었을 때 then() 함수 내의 코드를 실행시켜줍니다.
코드가 실행이 실패했을 경우엔 catch() 함수 내의 코드를 실행시켜줍니다.
이런 식으로 코드를 차례로 실행할 수 있게 도와주는 디자인 패턴이 바로 Promise입니다.
var 프로미스 = new Promise(function(resolve, reject){
var 더하기 = 1 + 1;
resolve(); //성공!
});
프로미스.then(function(){
console.log('연산이 성공했습니다') //성공했으니 then 안에 요함수를 실행.
}).catch(function(){
});
//연산이 성공했습니다
참고로 연산결과같은걸 then 안에서 활용하고 싶으면
위처럼 resolve(); 함수 파라미터안에 넣어주시면 됩니다.
var 프로미스 = new Promise(function(resolve, reject){
var 어려운연산 = 100 +1 ;
resolve(어려운연산);
});
프로미스.then(function(결과){
console.log(결과) //101
}).catch(function(){
console.log('실패했습니다')
});
1초후에 성공하는 Promise
그리고 성공시 특정 코드를 실행하고 싶다면
var 프로미스 = new Promise(function(resolve, reject){
setTimeout(function(){
resolve();
}, 1000);
});
프로미스.then(function(){
console.log('1초 대기 성공했습니다')
}).catch(function(){
console.log('실패했습니다')
});
setTimeout에 의해 1초후에 resolve() 성공함.
그래서 1초후 콘솔창에 '1초 대기 성공했습니다' 뜸.
그래서 fetch( ).then( )
이런거 쓸수잇듬.