Javascript/etc

[ Javascript ] - 비동기 처리?

algml0703 2022. 5. 26. 08:52
반응형

자바스크립트는 기본적으로 한 번에 여러 작업에 대한 처리가 가능한 비동기 처리 방식을 취하고 있습니다. 자바스크립트의 비동기 처리 방식은  사용자가 페이지  요청시 서버로부터 응답이 올 때까지 기다리지 않고, 서버에 데이터 요청 후 다른 코드를 실행함으로써  페이지를 요청한 사용자에게 보다 빠르게 페이지를 출력하여 보여 줄 수 있습니다.

* 비동기 처리

이전 작업의 실행 완료 여부와 상관없이 동시에 여러 작업을 실행하여, 실행이 먼저 완료되는 대로 결과물을 출력한다. 즉 이전의 작업이 완료되기 전에 다른 작업을 실행한다. 

* 동기 처리

작업의 우선 순서에 따라 작업이 실행되며, 이전 작업이 완료될 때까지 다른 작업은 대기 상태가 되었다가 이전의 작업이 모두 완료된 후 순서에 따라 다음 작업이 실행되는 것이다. 즉 프로그램의 실행이 순서대로 진행되는 것이다.

console.log(1);

setTimeout(()=>{
    console.log(2);
}, 3000);

console.log(3);

// 콘솔 출력 결과
// 1
// 3
// 2

위의 코드를 직접 실행해보면 1 3 2를 출력하게 되는데 이는 앞서 이야기 한 것처럼 자바스크립트의 특성인 비동기 처리 방식으로 인한 것이다. 위에서 부터 실행되어 1을 찍고 2를 찍는 작업을 실행 후 작업이 완료될 때까지 기다리지 않고 바로 다음 작업을 실행하여 3을 먼저 출력 후 그 다음으로 완료된 작업의 결과물인 2를 출력하게 된다.

 

출처 

https://kkhcode.tistory.com/6

반응형

'Javascript > etc' 카테고리의 다른 글

[ JAVASCRIPT ] - 객체 메소드  (0) 2022.06.10
[ Javascript ] - Promise란?  (0) 2022.05.26
[ Javascript ] - 기본 함수  (0) 2022.05.22
[ 자바스크립트 ] - some ( )  (0) 2022.05.17
[ Javascript ] - random 값 얻기  (0) 2022.05.17