TIL 37일차 - 동기&비동기/Node.js 모듈

박진현·2021년 7월 27일
0

TIL

목록 보기
37/71

동기 & 비동기


(왼쪽이 동기, 오른쪽이 비동기)

동기는 서버에 요청을 보내고나서 서버가 요청을 해석하여 다시 클라이언트에 응답할때 까지 멈추게 된다.
반면에, 비동기는 서버에 요청을 보내고 서버가 요청을 해석하여 다시 보낼 때 까지 나머지 프로세스를 진행한다.

  • 동기는 전화
    -> 하던 일을 멈추고 받아야 한다. (blocking)
    -> 요청에 대한 결과가 동시에 일어난다. (synchronous)
  • 비동기는 문자
    -> 확인 후, 나중에 답장할 수 있다 (non-blocking)
    -> 요청에 대한 결과가 동시에 일어나지 않는다 (asynchronous)

커피 주문으로 알아보는 동기 vs. 비동기

커피주문을 받은 후 완료될때 까지 다음 주문을 못 받는 동기
커피주문을 받은 후 완료되는 동안에도 다음 주문을 받을 수 있는 비동기

비동기의 주요 사례

  • DOM Element의 이벤트 핸들러
  • 타이머API
  • fetch API, AJAX(XHR)

그래서 비동기는 어떻게 사용하는데?

Callback

그건..이제 몰라도 됩니다.
앞으로 async랑 await만 쓰면 되니까!

callback을 쓰다보면 언젠가 위사진처럼 콜백지옥에 빠지게 될 거에요.

Promise

let promise = new Promise(function(resolve, reject) {
  // 프라미스가 만들어지면 executor 함수는 자동으로 실행됩니다.

  // 1초 뒤에 일이 성공적으로 끝났다는 신호가 전달되면서 result는 'done'이 됩니다.
  setTimeout(() => resolve("done"), 1000);
});

자세한건 여기서 보기 !
https://velog.io/@cadenzah/What-is-a-Promise

async/await

callback과 promise를 사용하다가 async/await를 사용해보니.. 브라켓을 신경써야 하는 경우가 엄청나게 줄어들었고 코드의 가독성도 말도안되게 개선되었다. 새로 나온 친구인 만큼 이 친구를 사용해야지!

( async말고 promise를 써야 할 때도 있다. 1과 2를 동시에 받아와서 동시에 출력해야할때
promise.all을 사용해야만 한다
)

자세한건 여기서 보기 !
https://velog.io/@cadenzah/What-is-a-Promise

Node.js 모듈

브라우저에서 사용할 수 있는 비동기 흐름은 타이머 혹은 DOM 이벤트와 관련된 상황으로 다소 한정적이지만, Node.js의 경우 많은 API가 비동기로 작성되어 있다.

백준 문제를 js로 풀려고 하다보면 입출력을 어떻게 받아야할지 몰라서 구글링을 해본적이 다들 있을거다.

const fs = require('fs')
let input = fsreadFileSync('/path').toStirng().split(' ')

을 이용해서 입력받고 a와 b등 인자를 따로 가공해야 문제를 풀 수 있는데
여기서 fs가 바로 node.js의 파일을 읽어오거나 저장할 수 있는 모듈이다!


위 코드처럼 callback을 사용해서 파일을 읽어볼 수 있고

아래 코드처럼 promise를 사용해서 파일을 읽어볼 수 있다.

알고리즘풀이

오늘은 알고리즘 98번을 풀었다.
요즘 그 날 안에 끝내야할 공부거리들이 너무 많아서 알고리즘을 따로 풀 시간이 잘 나지 않는다.
그리고 어제부턴가 머리가 잘 안 돌아가는 느낌이 든다. 수면시간이 부족해서 그런가?? 어제 새벽3시에 자서 그런 것 같다. 오늘도 벌써 새벽 1시 30분인데 원래같았으면 지금은 자고있어야 할 시간이다. 수면의 절대시간을 확보해야겠다.

profile
👨🏻‍💻 호기심이 많고 에러를 좋아하는 프론트엔드 개발자 박진현 입니다.

0개의 댓글