모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr this 키워드 객체는 상태(state)를 나타내는 프로퍼티와 동작(behavior)을 나타내는 메서드를 하나의 논리적인 단위로 묶은 복합적인 자료구조이다. 메서드는 자신이 속한 객체의 상태(프로퍼티)를 참조하고 변경할 수 있어야 한다. 그러기위해서는 먼저 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야 한다. 객체 리터럴 방식으로 생성한 객체..

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr 클로저 클로저는 자바스크립트 고유의 개념이 아니다. 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어(하스켈, 리스프, 얼랭, 스칼라 등)에서 사용되는 중요한 특성이다. MDN에서는 클로저에 대해 다음과 같이 정의하고 있다. A closure is the combination of a function and the lexical enviornment..

프로젝트를 진행하면서 문제 해결을 하기 위해 찾아보다가 stopPropagation() 개념을 처음 접했다. e.preventDefault() 는 몇번 써봤는데 비슷한 결(?)인 것 같고, 차이점을 확실히 알고 싶어서 모던 JS 책에서 찾아보게 되었다. 해당 개념을 찾아보게 된 상황 부모 컴포넌트는 기록된 식단 아이템 컴포넌트로서, 클릭하면 해당 식단 아이템의 상세페이지로 이동하는 onClick 이벤트 핸들러 함수가 지정되어 있음 자식 컴포넌트는 휴지통 그림 버튼이고, 해당 버튼을 눌렀을 때 팝업을 띄우는 컴포넌트임 문제는 휴지통을 클릭했을 때 팝업창이 뜨지 않고 상세페이지로 이동해버리는 것 현재 상황에서는 휴지통 버튼 역시 컨테이너에 속하므로 클릭했을 때 상세페이지로 이동하게 되는 것이다. 해결방법 ⇒..

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr var 키워드로 선언한 변수의 문제점 ES5까지 변수를 선언하는 유일한 방법은 var 키워드를 사용하는 것이었다. var 키워드로 선언된 변수는 다음과 같은 특징이 있다. 이는 다른 언어와는 구별되는 독특한 특징으로서, 주의를 기울이지 않으면 문제를 일으킬 수 있다. 변수 중복 선언 허용 var 키워드로 선언한 변수는 중복 선언이 가능하다. // 예제..

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr 실행 컨텍스트는 자바스크립트의 동작 원리를 담고 있는 핵심 개념이다. 실행 컨텍스트를 바르게 이해하면 자바스크립트가 스코프를 기반으로 식별자와 식별자에 바인딩된 값(식별자 바인딩)을 관리하는 방식과 호이스팅이 발생하는 이유, 클로저의 동작 방식, 그리고 태스크 큐와 함께 동작하는 이벤트 핸들러와 비동기 처리의 동작 방식을 이해할 수 있다. 소스코드의 ..

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr 변수의 생명 주기 지역 변수의 생명 주기 변수는 선언에 의해 생성되고 할당을 통해 값을 갖고, 언젠가 소멸한다. 즉, 변수에는 생명 주기가 있다. 변수에 생명 주기가 없다면 한번 선언된 변수는 프로그램을 종료하지 않는 한 영원히 메모리 공간을 점유하게 된다. 변수는 자신이 선언된 위치에서 생성되고 소명한다. 전역 변수의 생명 주기는 애플리케이션의 생명..

모던 자바스크립트 Deep Dive 를 읽고 작성한 학습용 게시글입니다. 모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작 원리 269개의 그림과 원리를 파헤치는 설명으로 ‘자바스크립트의 기본 개념과 동작 원리’를 이해하자! 웹페이지의 단순한 보조 기능을 처리하기 위한 제한적인 용도로 태어난 자바스크립트는 과도 wikibook.co.kr 스코프란? 스코프(유효범위)는 자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념이다. 더욱이 자바스크립트의 스코프는 다른 언어의 스코프와 구별되는 특징이 있으므로 주의가 필요하다. 그리고 var 키워드로 선언한 변수와 let 또는 const키워드로 선언한 변수의 스코프도 다르게 동작한다. 스코프는 변수 그리고 함수와 깊은 관련이 있다..