처음부터 차근차근

DOM이란?? DOM : Document Object Modeling 이것만 가지고는 이해하기 힘들다. DOM의 기본 개념부터 알아보자. DOM의 기본 개념 DOM을 이해하기 위해서는, 웹 브라우저가 어떻게 동작하는지 알아야 한다. 1. Javascript가 왜 생겼는가?? - 브라우저에서 쓰려고 만들어진 언어 - 본연의 역할 : 웹 페이지를 동적으로 만들기 위해! (클릭하면 버튼이 이동한다던가, 리스트가 변한다던가..) → 즉, HTML문서를 조작해서 생명력을 불어넣어주기 위해 만들어진 언어. 2. 웹 페이지가 뜨는 과정 1) 사용자가 브라우저에 어떠한 주소를 입력한다. (여기서 사용자 = 브라우저 = 클라이언트, 같은 의미로 생각하면 된다) → 클라이언트가 서버에게 요청(request) 2) HTML..

Callback(콜백함수)이란?? 프로그래밍에서 Callback 또는 Callback function이란 다른 코드의 인수로서 넘겨주는 실행 가능한 코드를 말한다. 콜백을 넘겨받은 코드는 이 콜백을 필요에 따라 즉시 실행할 수도 있고, 나중에 실행할 수도 있다. 간단한 예시로, setTimeout, 혹은 forEach 메소드를 통해 알아보자. // setTimeout setTimeout(function() { console.log("Hello, world!"); }, 1000); // forEach const numbers = [1, 2, 3, 4, 5]; numbers.forEach(function(number) { console.log(number); }); 여기서 봤을 때 Callback은 Call..

다른 객체지향 언어에서의 this : 클래스로 생성한 인스턴스 객체를 의미한다. Javascript에서의 this : 어디에서든지 사용가능하다. This : '이것' 이란 뜻. this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-reference variable)이다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this는 자바스크립트 엔진에 의해 암묵적으로 생성된다. this는 코드 어디서든 참조할 수 있다. 자바스크립트의 this는 기본적으로 실행 컨텍스트가 생성될 때 결정된다. 즉, 함수를 호출할 때 결정된다. 하지만 this는 객체의 프로퍼티나 메서드를 참조하기 위한 자기 참조 변수이므로 일반적으로 ..

실행 컨텍스트란?? 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이며, 실행 컨텍스트가 활성화되는 시점에 다음과 같은 일을 진행한다. 선언된 변수를 위로 끌어올리기(호이스팅) 외부 환경 정보를 구성 this 값을 설정 이러한 특징으로 인해 JS는 타 언어랑 다른 특징이 발생. Call stack에 대한 이해 동일 환경에 있는 코드를 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고 이것을 위에서 설명한 '스텍'의 한 종류인 Call stack으로 쌓아 올린다. 가장 위에 쌓여있는 컨텍스트와 관련된 코드를 실행하는 방법으로 코드의 환경 및 순서를 보장한다. 컨텍스트의 구성 1) 실행 컨텍스트를 구성할 수 있는 방법 전역공간 eval()함수 함수(우리가 흔히 실행컨텍스트를 구성하는 방법) 2) 실..