JavaScript 정리

이병우·2023년 1월 29일
0

front-end

목록 보기
2/3

this

  • 기본적으로 this는 window. (브라우저 런타임)

  • 'use strict' 모드는 this가 undefined -> ES2015 노드 모듈에서는 자동 적용

  • node module 환경에서는 전역 this가 module.exports

  • this는 호출 될 때 결정 됨.

비동기란

  • 동기가 아닌 것. 비동기를 동기로 바꿀 순 없음. 비동기가 어떻게 돌아가는지 파악하고 순서를 알아야 한다.

  • 콜 스택 > 비동기 코드들의 실행 공간 (백그라운드)에서 특정 조건이 달성 되면 > macro 큐 or micro 큐 > 이벤트 루프가 돌면서 콜 스택이 비었으면 > 콜 스택
    특정 조건 예시) setTimeout은 초가 지나면, .then은 Promise의 resolve 함수가 호출 되면

  • promise는 마이크로 큐에 들어가고 대부분의 나머지는 매크로 큐에 들어감. (이벤트 루프는 마이크로 큐를 우선순위로 콜 스택에 올림.)

  • setInterval같은 경우는 클리어 시키지 않는 이상 백그라운드에서 사라지지않는다.

  • 순서가 명확하도록 코드를 짜야함. > 순서를 명확히 하다보면 콜백, .then 지옥이 형성 되는데 Promise, async await로 해결.

Promise with async await

  • 실행은 시켜놓고 결과가 나오고 나온 결과를 나중에 사용 할 수 있음.

  • 만약에 실행 후 리턴 값을 바로 보여주고 싶은데 리턴이 아직 안왔다 > 리턴 올 떄 까지 기다리고 실행 됨.

  • 콜백 지옥의 단점은 결과값을 바로 받아야 한다는 것. 이걸 Promise로 받아 나중에 사용 가능 해짐.

  • Promise.all은 난감함. 결괏값을 한 번에 처리하는 함수: 하나라도 실패하면 다 실패.
    Promise.allSettled는 결괏값에 어떤 Promise가 성공했고 실패했는지 나옴.

  • await를 선언하면 뒤에 붙는게 비동기가 아니여도 비동기가 됨.

  • async await 함수의 동기 부분은 첫 번째 await 전에 끝난다.

profile
맛있게 개발하는게 목표!

0개의 댓글