본문으로 바로가기

promise

category JavaScript/ES6 2020. 11. 3. 23:52

promise

const promise = new Promise(function executor(resolve, reject){
        ---
});

프로미스 생성자는 실행자라고 불리는 함수를 인자로 받는데

이 실행자는 차례로 resolve, reject 콜백 함수를 받는다

이 실행자 함수를 작성하고 그 결과에 따라서 reslove와 reject 둘 중 하나를 무조건 호출해야한다

작성한 함수가 성공적일 경우

reslove를 호출

실패했을 경우

reject를 호출

프로미스 객체 생성

const promise = new Promise(function executor(resolve, reject){
    setTimeout(()=>resolve(console.log('done')),1000);
});

이 코드를 작성하고 돌리면 resolve 함수가 호출되는 것을 볼 수 있는데

이 점에서 우리는 excutor함수가 생성과 동시에 실행되는 것을 알 수 있다

then, catch, finally

then

then은 프로미스에서 가장 기본이 되는 메소드다

const promise = new Promise((resolve, reject)=>{
    setTimeout(()=>resolve('success'),1000);
    setTimeout(()=>reject(new Error('fail')),1000);
});

promise.then(
    (value)=>{
        console.log(value);
    },
    (error)=>{
        console.log(error);
    }
);

then은 두개의 함수를 인자로 받는데 첫째 함수는 프로미스가 성공했을 때 resolve로

두번째 함수는 실패했을 때 reject로 보낸다


성공했을 경우만 다루고 싶다면 then에 인자를 하나만 넣어주면 된다

catch

프로미스가 실패했을 경우만 다루고 싶을 때 catch를 사용하는데

const promise = new Promise((resolve, reject)=>{
    setTimeout(()=>reject(new Error('fail')),1000);
});

promise.catch(
    (error)=>{
        console.log(error);
    }
);

처럼 사용한다

catch는 then에서 첫번째 인자에 null을 넣은 것과 완전히 동일하게 작동한다

promise.then(
    null,
    (error)=>{
        console.log(error);
    }
);

finally

프로미스의 성공, 실패 결과와는 상관없이 호출된다

const promise = new Promise((resolve, reject)=>{
    setTimeout(()=>reject(new Error('fail')),1000);
});

promise.finally(()=>{
    console.log('아무말')
}).then(null,
    (error)=>{
    console.log(error);
}).finally(()=>{
    console.log('아말무');
    }
)

then의 위,아래로 작성된 finally가 둘다 출력되는 것을 볼 수 있다

'JavaScript > ES6' 카테고리의 다른 글

class  (0) 2020.11.03
arrow function  (0) 2020.10.26
Weakmap, Weakset  (0) 2020.10.25
Destructuring  (0) 2020.10.21
Array  (0) 2020.10.20