본문으로 바로가기

동기(Synchronous)&비동기(Asynchronous)

category Web 2019. 11. 6. 02:07

node.js로 과제물 진행중에 비동기처리 덕에 엄청난 시간낭비를 하게되어서,,,😅

잊지않기 위해 포스팅해보려고 합니다..

(특히 node.js는 비동기 방식의 처리를 기본철학(?)으로 한다고...허허)


1. 동기(Synchronous)란?

쉽게 설명해 순차적으로 처리되는 방식이다. 아마 우리에게 더 익숙한 처리방식일 것이다.

 

<Task1> <Task2> <Task3>, .... 여러개의 업무가 순서대로 나열되어 있다면

한개의 업무가 완료되어야 다음 업무가 시작되고 또 해당업무가 끝나면 그 다음 업무가 동작하게하는 방식이다.

따라서 코드가 동기식으로 처리된다면 상황에 따라 긴 수행시간이 발생하며 해당 업무가 완료되기까지 대기해야하므로 처리해야되는 업무가 많은 경우에는 효율성이 떨어지게 될것이다.

 

2. 비동기(Asynchronous)란?

업무를 수행시키고 완료되지 않더라도 다른 업무를 동시에 요청할 수 있는 방식이다.

 

<Task1> <Task2> <Task3>, ... 여러개의 업무가 있다면

순서대로 업무를 요청하더라도 요청해둔 업무가 완료되기를 기다리지 않고 또 다른 업무를 수행할 수 있는 방식이다.

 

굳이 업무 수행이 끝나기를 기다리지 않고 여러 업무를 동시에 처리할 수 있다는 부분이 장점일 수 있다.

그러나 업무 수행을 요청한 순서와 업무가 완료되는 순서가 다를 수 있기 때문에 이 부분을 고려해서 사용해야 한다.

 

3. 코드 예시

example - sample.txt

B

example - sync.js

var fs = require('fs');
 
//readFileSync 동기식
console.log('A');
var result = fs.readFileSync('syntax/sample.txt', 'utf8');
console.log(result);
console.log('C');
 
//readFile 비동기식
console.log('A');
fs.readFile('syntax/sample.txt', 'utf8', function(err, result){
    console.log(result);
});
console.log('C');

파일을 동기식, 비동기식 두가지 방식으로 읽어오도록 작성해 보았습니다.

동기식 처리, 비동기식 처리를 각각 주석처리해 따로 실행해보고 비교해보면됩니다.

 

  • readFileSync를 실행하면
    A
    B
    C
    이렇게 순서대로 출력되고

  • readFile을 실행하면
    A
    C
    B
    이렇게 출력됩니다.

비동기식 처리방식 예시의 경우
sample.txt파일을 읽어오는 작업을 수행시키고 완료되는걸 기다리지 않고 'C'를 출력하는 작업도 수행되었고 'C'출력 작업이 먼저 완료되었기 때문에 A C B 순서로 출력된거겠죠!

 

- 참고자료

Node.js: 비동기 프로그래밍 이해: http://www.nextree.co.kr/p7292/

Node.js 기본/ 동기&비동기 개념: https://asfirstalways.tistory.com/51

Node.js - 동기와 비동기 그리고 콜백: https://opentutorials.org/course/3332/21132

 


동기식 처리방식에 익숙해져있던 상태에서

비동기식 처리방식으로 동작되는 코드들을 보며,,,

실행순서가 왜이래ㅜ 이게아닌데 하며 당황하는 경험을했습니다.

동기식, 비동기식 처리가 어려운 개념은 아닌데

자주 안접하게 되면 동기식이 당연시되서

비동기식이란게 있던지도 까맣게 잊게 되네요^^....ㅎ하

유의하고 언젠가 또 까먹을 저를 위해 포스팅해보았습니다😂

'Web' 카테고리의 다른 글

OAuth 2.0 이란?  (0) 2020.03.10
CORS(Cross Origin Resource Sharing)란?  (0) 2020.03.06
HTTP 프로토콜 이란?  (0) 2019.07.16
Web이란?  (0) 2019.07.08
서버 사이드 렌더링 (SSR) & 클라이언트 사이드 렌더링 (CSR)  (4) 2019.06.07