[ 모던 자바스크립트 스터디 ] 클로저(closure)
·
Archive/Develop
MDN 에서 클로저는 아래와 같이 정의한다. 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. const x = 1; function outerFunc() { const x = 10; function innerFunc() { console.log(x); // 10 } innerFunc(); } outerFunc(); const x = 1; function outerFunc() { const x = 10; innerFunc(); } function innerFunc() { console.log(x); // 1 } outerFunc(); 자바스크립트는 렉시컬 스코프를 따르는 프로그래밍 언어기 때문에, 두 코드의 실행 결과가 차이가 있는 것이다. 아마 예에전의 포스팅에서도 한번 다뤘었을텐데, 자바스..
[ 모던 자바스크립트 스터디 ] 실행 컨텍스트
·
Archive/Develop
소스코드 타입 ECMAScript 사양은 소스코드를 4가지 타입으로 구분한다. 소스코드 타입 설명 전역 코드 전역에 존재하는 소스코드로, 전역에 정의된 함수나 클래스의 내부 코드는 포함되지 않는다. 함수 코드 함수 내부에 존재하는 소스코드로, 함수 내부에 중첩된 함수나 클래스 등의 내부 코드는 포함되지 않는다. eval 코드 빌트인 전역함수인 eval 함수에 인수로 전달되어 실행되는 소스코드를 말한다. 모듈 코드 모듈 내부에 존재하는 소스코드를 말한다. 모듈 내부 함수, 클래스 등의 내부 코드는 포함되지 않는다. 소스코드를 왜 굳이 4가지 타입으로 나누었는가? 이 소스코드의 타입에 따라 실행 컨텍스트를 생성하는 과정과 관리 내용이 다르기 때문이다. 더보기 전역 코드 전역 코드는 전역 변수를 관리하기 위해..
[ 모던 자바스크립트 스터디 ] 프로토타입 - 1
·
Archive/Develop
자바스크립트는 프로토타입을 기반으로 상속을 구현한다. 이 프로토타입이 어떤 것인지 알아보자. function Circle(radius) { this.radius = radius; this.getArea = function () { return Math.PI * this.radius ** 2; }; } const c1 = new Circle(1); const c2 = new Circle(2); 위 코드의 c1과 c2 객체는 모두 각각 radius 프로퍼티와 getArea 메서드를 갖는다. getArea 메서드가 각 객체마다 존재할 필요가 있을까? 메모리 낭비다. 하나만 생성해서 모든 인스턴스가 공유해서 사용하는게 더 올바르다. 이걸 상속을 통해서 중복을 제거해보자. function Circle(radius..
[ 모던 자바스크립트 스터디 ] 함수와 일급 객체
·
Archive/Develop
일급 객체 아래 조건을 만족하는 객체는 일급 객체 이다. 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다 변수나 자료구조에 저장할 수 있다. 함수의 매개변수에 전달할 수 있다. 함수의 반환값으로 사용할 수 있다. 자바스크립트의 함수는 위 조건을 다 만족하기때문에 일급 객체이다. 함수 객체의 프로퍼티 함수는 객체이기에 함수도 프로퍼티를 가질 수 있다. arguments, caller, length, name, prototype 프로퍼티는 모두 함수 객체의 데이터 프로퍼티다. 하지만 __proto__ 는 접근자 프로퍼티고ㅡ 함수 객체 고유의 프로퍼티가 아닌 Object.prototype 객체의 프로퍼티를 상속받은 것이다. Object.prototype 객체의 프로퍼티는 모든 객체가 상속받아..