자바스크립트
[자바스크립트] 실행 컨텍스트 (2)
실행 컨텍스트 실행 컨텍스트는 자바스크립트의 동작 원리를 담고 있습니다. 실행 컨텍스트를 바르게 이해하면 스코프 기반으로 식별자와 식별자에 바인딩된 값을 관리하는 방식, 호이스팅의 이유, 클로저(!!)의 동작 방식등의 동작 방식의 이해가 가능합니다. 이번에는 예제를 통해 어떻게 실행 컨텍스트가 생성되고 식별자를 검색하는지 살펴보겠습니다. 예제를 통해 알아보는 실행 컨텍스트의 생성과 식별자 검색 과정 var x = 1; const y = 2; function foo(a) { var x = 3; const y = 4; function bar(b) { const z = 5; console.log(a + b + x + y + z); } bar(10); } foo(20); // 42 0. 전역 객체 생성 사실 자..
[자바스크립트] 실행 컨텍스트 (1)
실행 컨텍스트 실행 컨텍스트는 자바스크립트의 동작 원리를 담고 있습니다. 실행 컨텍스트를 바르게 이해하면 스코프 기반으로 식별자와 식별자에 바인딩된 값을 관리하는 방식, 호이스팅의 이유, 클로저(!!)의 동작 방식등의 동작 방식의 이해가 가능합니다. 내용이 방대하기 때문에 여러번에 나눠서 시리즈처럼 정리해보도록 하겠습니다. 소스코드 자바스크립트에서 소스코드는 총 4가지 타입으로 구분합니다. 이를 굳이 구별해놓은 이유는 당연히 서로 다르기 때문입니다. 소스코드의 타입에 따라서 실행 컨텍스트를 생성하는 과정이 다르고 관리하는 내용도 달라집니다. 소스코드는 아래와 같이 구분합니다. 타입 내용 전역 코드 전역에 존재하는 코드. 함수, 클래스등의 내부 코드는 포함 x 함수 코드 함수 내부에 존재하는 코드. 중첩된..
[자바스크립트] 자바스크립트에서의 this
자바스크립트에서의 this Java 나 C++ 같은 언어에서의 this는 항상 클래스가 생성할 인스턴스를 가리키게 됩니다. 하지만 자바스크립트에서의 this는 함수 호출 방식에 따라서 this 바인딩이 동적으로 일어나게 됩니다. 이는 this 바인딩에 대해서 제대로 알지 못하면 예기치 않은 결과를 만들어 낼 수 있다는 것을 이야기합니다. 이번 글에서는 자바스크립트의 this 바인딩이 동적으로 일어나는 경우에 대해서 정리해보도록 하겠습니다. this 란? this 는 객체 지향 프로그래밍과 관련이 있습니다. 객체란, 상태를 나타내는 프로퍼티와 동작을 나타내는 메서드를 하나의 논리적인 단위로 묶은 복합 자료구조입니다. 메서드는 객체의 상태인 프로퍼티를 참조, 변경이 가능해야 합니다. 이 경우 메서드의 입장에..
[자바스크립트] 클래스란 무엇일까?
JS 의 클래스 자바스크립트는 프로토타입 기반의 객체지향 언어입니다. 대부분의 사람들은 자바스크립트는 객체지향 프로그래밍이 아닌 함수형 프로그래밍 언어로 알고있지만, 사실 자바스크립트는 프로토타입을 기반으로 한 강력한 객체지향 프로그래밍을 제공하기도 하는 멀티 패러다임 언어입니다. 프로토타입이에요. 사실 대부분의 사람들은 Java, C++ 과 같은 언어에서부터 시작해 클래스 기반 언어에 익숙합니다. 이런 분들은 프로토타입 기반의 프로그래밍 방식에 어려움을 느낄 수 있어 프로토타입은 JS 를 어렵게 느끼게 만드는 수많은(?) 장벽중 하나의 장벽으로 인식되고는 했습니다. 프로토타입 쉬워요 ^^ 한번 해요 ^^ 라고 말하는 JS 의 프로토타입 고수(?)가 아닌, 클래스가 익숙한 프로그래머들의 좀 더 빠른 학습..