❓클로저란 일반적으로 클로저는 함수와 해당 함수가 정의되어 있는 렉시컬 환경과의 조합을 의미한다. 하지만 클로저의 본질에 부합하기 위해서는 생명 주기가 종료된 외부 함수의 변수를 참조할 수 있어야 한다. 클로저는 스코프, 실행 컨텍스트와 밀접한 관련이 있기 때문에 이전에 정리해두었던 스코프, 실행 컨텍스트 포스팅을 먼저 참고했으면 한다. 1️⃣ 클로저와 렉시컬 환경 const name = "Lee"; function outer() { const name = "Kim"; function inner() { console.log(`Hi! ${name}`); } return inner; } const closure = outer(); closure();// ? 위의 예시를 통해 클로저의 동작 방식에 대해서 설명..
❓실행 컨텍스트란 실행 컨텍스트는 자바스크립트가 동작하기위해 필요한 환경으로, 모든 코드는 실행 컨텍스트를 통해서 실행되고 관리된다. 지난 포스팅에서 알아보았던 스코프, this 또한 모두 실행 컨텍스트 내에서 관리되고 코드의 실행 순서는 실행 컨텍스트 스택에 의해서 관리된다. 1️⃣ 소스코드의 평가와 실행 실행 컨텍스트에 대해서 알아보기 전에 소스코드가 동작하는 과정에 대해서 알아보자. 모든 소스코드는 평가와 실행과정으로 나뉜다. 각각 소스코드 평가와 소스코드 실행은 다음과 같은 역할을 담당한다. 🔘 소스코드 평가: 실행 컨텍스트 생성하고 선언문을 먼저 실행하여 변수 또는 함수 식별자를 생성된 실행 컨텍스트가 관리하는 스코프에 등록 🔘 소스코드 실행: 선언문을 제외한 소스코드가 순차적으로 실행. 즉, ..
❓this란 this는 자기 참조 변수를 의미하는 식별자이고, this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키며 해당 프로퍼티 또는 메서드를 참조하는 것이 가능하다. 간단한 예제를 먼저 보자. console.log(this)// window 브라우저 환경에서 위의 코드를 입력하면 this는 전역 객체인 window를 참조한다. 그렇다면 this는 전역객체만을 가리키냐? 그건 아니다. const user = { name: "kim", getName() { return this.name; } } console.log(user.getName())// kim 객체 리터럴에서는 this가 자신이 속한 객체를 바인딩 하는 것을 알 수 있다. function User(name) { this.name..
❓빌트인 객체란 일단 빌트인(built in)의 사전적 정의는 "내장"이다. 그렇다면 빌트인 객체는 내장되어 있는 객체라고 이해할 수 있을텐데, 실제로 빌트인 객체는 자바스크립트에서 기본적으로 제공하는 객체를 의미한다. 그렇다면 빌트인 객체의 종류로는 어떤 것들이 존재할까? 그 이전에 자바스크립트에서의 객체 구분에 대해서 알아보자. 1️⃣ 표준 빌트인 객체: 위에서 설명한 자바스크립트에서 기본적으로 제공하는 객체로 ECMAScript 사양에 정의되어 있는 객체이기 때문에 자바스크립트의 실행환경 즉, 브라우저든 node.js든 상관없이 언제나 사용이 가능하다. 표준 빌트인 객체는 전역 객체의 프로퍼티로 제공된다. 2️⃣ 호스트 객체: 표준 빌트인 객체가 실행환경에 상관없이 제공되는 객체라면 호스트 객체는 ..
❓프로토타입이란 자바스크립트는 원시값을 제외한 거의 모든 것이 객체라는 사실은 들어봤을 것이다. 프로토타입은 자바스크립트에서 객체지향을 구현하는데 중요한 매커니즘으로 객체간의 상속을 위해 사용되는 개념이다. 다음 코드를 살펴보자. function Fruit(num) { this.num = num this.price = function () { return this.num * 500 } } const fruit1 = new Fruit(10) const fruit2 = new Fruit(20) Fruit 생성자 함수를 통해 생성된 인스턴스들은 모두 각각 num과, price라는 프로퍼티를 갖는다. 하지만 살펴보면 각각의 인스턴스가 다른 num을 가지는 것은 문제가 없지만, price 메서드는 각 인스턴스가 ..
❓스코프란 스코프는 사전적 정의로 범위라는 의미를 가진다. 말그대로 스코프는 변수 또는 함수가 유효한 "범위"를 나타낸다. 사실 변수 이름, 함수 이름, 클래스 이름과 같이 모든 식별자는 어디에서 선언되었는 지에 따라 범위가 결정되고 식별자를 참조할 때 어떤 식별자를 참조해야 하는지를 스코프를 통해 정하게 된다. 실제로 우리는 컴퓨터를 사용하면서 스코프에 대해서 간접적으로 경험하고 있었다고 해도 과언이 아니다. 특정 파일의 이름을 "a"라고 했을 때 같은 폴더 내에서 두개의 파일 이름이 "a"일 수는 없지만, 다른 폴더내에서는 각각의 파일이 "a"라는 이름을 가질 수 있다. 1️⃣ 스코프의 종류 프로그래밍 공부를 해본 사람이라면 다들 전역 변수와 지역 변수에 대해서 들어본 적이 있을 것이다. 이 때 변수..
❓호이스팅이란 hoisting을 번역해보면 '끌어올리다'라는 뜻을 가진다. 기본적으로 코드는 위에서 아래로 순차적으로 실행되지만, 사전적 정의와 마찬가지로 자바스크립트에서 호이스팅은 모든 선언문을 해당 스코프의 최상단으로 끌어올리는 동작을 말한다. 실제로 코드가 끌어올려지는 것은 아니고 자바스크립트 엔진이 런타임 이전에 모든 선언들을 렉시컬 환경이라고 하는 자바스크립트 내부 데이터 구조에 저장하는 것으로 선언문이 끌어 올려진 것처럼 동작하는 것이기 때문에 오해하는 일이 없길 바란다. 변수 호이스팅 변수는 var, let, const 키워드를 사용하여 선언을 진행한다. 이 때 var과 let, const와의 호이스팅에는 차이가 존재하기 때문에 구분해서 알아보도록 하자. 1️⃣ var var과 let, co..
