JavaScript/JavaScript 기초

[Javascript ES8] 기초 문법 15. async, await

찰리-누나 2022. 12. 21.

 

 

async, await


async과 await 은 ES8에 나온 새로운 문법이다.

먼저 async는 함수 앞에만 붙일 수 있는 키워드로, 함수가 실행될 경우 promise 오브젝트를 자동으로 남게 해 준다. 그러나 성공의 경우만 가능한 것이 단점이다.

<script>

    async function plus() {
        return 1+2+3+4+5+6+7+8+9+10
    }

    plus().then(function(result){
        console.log(result)
    })

    
</script>

결과

 

때문에 await을 사용한다. await는 '프로미스를 해결할 때 까지 기다리라' 는 뜻이다. 프로미스가 성공하면 실행되고, 실패할 경우 에러를 발생하고 멈춘다. 따라서 실패를 다루기 위하여 try-catch문을 사용해야 한다.

 

아래 코드를 실행하면 await에 따라 프로미스 속의 'promise실행' 이 먼저 출력되고, try 문으로 성공했을 경우에만 전달받은 연산의 결과를 출력한다. 


<script>

    async function plus() {
       
       let promise = new Promise(function(resolve, rejected){
           let plus = 1+2+3+4+5+6+7+8+9+10
           console.log('promise실행')
           resolve(plus)
       })
       
        try {
            let result = await promise
            console.log(result)
        } catch {
            console.log('프로미스 실패')
        }

    }

    plus() 

    
</script>

결과

 

댓글