전체 글

개요 실행컨텍스트는 코드가 실행되는 환경을 말합니다. 크게 전역 컨텍스트와 함수 컨텍스트가 있는데, 우선 코드가 실행되면 (브라우저가 스크립트를 로딩해서 실행할 때) 모든 것을 포함하고 관리하는 전역 컨텍스트가 생깁니다. 페이지가 종료 될때까지 유지됩니다. 다음 함수 컨텍스트는 함수 호출시마다 생성됩니다. 이 실행컨텍스트들은 생성될때마다 변수객체, 스코프체인, this가 생성됩니다. 컨텍스트 생성 후 함수가 실행되는데 사용되는 변수들은 변수 객체 안에서 값을 찾고 없으면 스코프 체인을 따라 올라가며 찾습니다. 함수 실행이 마무리되면 해당 컨텍스트는 사라집니다. (클로저 제외) 페이지가 종료되면 전역 컨텍스트가 사라집니다. 먼저 전역 컨텍스트 하나 생성 후, 함수 호출 시마다 컨텍스트가 생깁니다. 컨텍스트..

들어가며 이벤트 등록 방법 이벤트 전달 방식 (이벤트 버블링, 이벤트 캡쳐링, 이벤트 위임) event.stopPropagation() 이벤트 등록 이벤트 등록이란 웹 어플리케이션에서 사용자의 입력을 받기 위해 필요한 기능입니다. 1) 간단한 버튼을 만듭니다. add one item 2) 버튼 클릭 시 addItem 함수를 실행되고, 이 때 event 인자가 넘어옵니다. let button = document.querySelector('button'); button.addEventListener('click', addItem); function addItem(event) { console.log(event); } 이처럼 addEventListener 같은 웹 API는 이벤트 등록을 가능하게 해줍니다. 이..

들어가기전 이벤트루프에 대해 글을 처음쓴건 20년도인데, 21년도에 이 글을 보니 다시 정리할 필요가 있다는 생각이들었습니다. MDN 공식문서를 보면서 새롭게 보였던 부분이 있었습니다. 이벤트루프와 자바스크립트의 동시성 모델을 연관지어 설명한 부분입니다. 처음 이 개념을 공부할때는 이벤트루프만 이해하기 바빴는데 동시성 모델과 같이 이해하니, 이벤트루프가 자바스크립트의 언어적 특성과 깊은 연관이 있다는 점을 발견했습니다. 동시성을 지원하는 이벤트루프 자바스크립트의 동시성 모델과 이벤트루프의 연관성은 근본적으로 자바스크립트의 싱글스레드인 언어적 특성에서 비롯됩니다. 이는 한명의 일꾼으로 한번에 하나의 작업을 처리할 수 있다는걸 의미합니다. 하지만 프로그램이 복잡해지고 커지다보면 한명의 일꾼으로는 턱없이 부족..

비동기를 처리하는 3가지 방법 1. Callback 함수 showFirst(function(result) { showSecond(result, function(nextResult) { showThird(nextResult, function(finalResult) { console.log('the final result: ' + finalResult); }, failureCallback); }, failureCallback); }, failureCallback); 문제점 1) 가독성이 매우 떨어진다. (콜백지옥) 2) 복잡해지는 에러처리. - 각 콜백함수에서 에러 핸들링을 해주어야한다. 에러처리를 하지 않으면 콜백함수 호출시, 어디서 에러가 발생한지 알기 어렵다. 2. Promise 객체 Promise를 ..