인생은 효율성

어느 날 문득 ‘이벤트 루프가 실행되는 과정을 시작적으로 확인해 볼 수 있는 방법이 있을까?’ 하는 궁금증이 들었다.물론 console.log()를 코드 곳곳에 넣어서 출력을 확인하거나 console.trace()로 콜스택을 살펴볼 수도 있지만, 뭔가 더 간편하게 보여주는 방법이 있을 것 같았다.이 글에서는 debugger를 이용해 콜스택(Call Stack)과 마이크로태스크 큐(Microtask Queue)의 실행 과정을 직접 눈으로 확인하는 방법을 알아보겠다.1. 이벤트 루프 실행 순서 확인하기프론트엔드 면접에서 자주 등장하는 문제 중 하나가 다음 코드의 실행 순서를 예상하는 것이다.console.log("1");setTimeout(() => { console.log("2");}, 0);Promis..

기존의 방식으로 사용하던 함수에는 필요 없는 부분이 많다. 이런 부분을 전부 걷어내고 사용하자는 의도로 만들어진 것이 화살표 함수다. 화살표 함수 화살표 함수에는 =>만 있을 뿐 function키워드나 return키워드, 인수의 괄호, 중괄호가 모두 생략되었다. function getFirstLetter(str) { return str[0]; } 이와 같은 함수를 이름이 함수의 일부분으로 선언되었다는 뜻으로 기명 함수라고 한다. 혹은 아래와 같이 이름이 지정되지 않은 익명 함수를 선언하고 변수에 할당하는 방식도 있다. const getFirstLetter = function () { return str[0]; }; 여기서 화살표 함수를 만들기 위해 function키워드와 인수를 감싸던 괄호를 제거해보자...