sharingStorage

26.1 함수의 구분 ES6 이전까지 자바스크립트의 함수느느 별다른 구분 없이 다양한 목적으로 사용되었다. 이는 혼란스러우며 실수를 유발할 가능성이 있고 성능에도 좋지 않다. 이러한 문제를 해결하기 위해 ES6에서는 함수를 사용 목적에 따라 세가지 종류로 명확히 구분했다. ES6 함수의 구분 constructor prototype super arguments 일반 함수 O O X O 메서드 X X O O 화살표 함수 X X X X 26.2 메서드 ES6 사양에서 메서드는 메서드 축약 표현으로 정의된 함수만을 의미한다. ES6 메서드는 자신을 바인딩한 객체를 가리키는 내부 슬롯 [[HomeObject]]를 갖는다. 이는 super 키워드를 사용할 수 있다는 말이기도 하다. 26.3 화살표 함수 화살표 함수..

25. 클래스 ES6에서 도입된 클래스는 객체지향 프로그래머가 더욱 빠르게 학습할 수 있도록 클래스 기반 객체지향 프로그래밍 언어와 매우 흡사한 새로운 객체 생성 메커니즘을 제시한다. 클래스와 생성자 함수는 모두 프로토 타입 기반의 인스턴스를 생성하지만 정확하게 동일하게 동작하는 것은 아니다. 클래스는 생성자 함수보다 엄격하며 다음과 같이 몇 가지 차이가 있다. 클래스를 new 연산자 없이 호출하면 에러가 발생한다. 하지만 생성자 함수를 new 연산자 없이 호출하면 일반함수로서 호출된다. 클래스는 상속을 지원하는 extends와 super 키워드를 제공한다 클래스는 호이스팅으 발생하지 않는 것처럼 동작한다. 하지만 함수 선언문으로 정의된 생성자 함수는 함수 호이스팅이, 함수 표현식으로 정의된 생성자 함수..

클로저는 자바스크립트 고유의 개념이 아니다. 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다. MDN에서 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. 라고 정의한다. 24.3 클로저와 렉시컬 환경 위 코드에서 외부 함수보다 중첩함수가 더 오래 유지 되는 경우 중첩 함수는 이미 생명주기가 종료한 외부 함수의 변수를 참조할 수 있다. 이러한 중첩 함수를 클로저라고 부른다. 위에 outer 함수의 실행 컨텍스트는 실행 컨텍스트 스택에서 제거되지만 outer 함수의 렉시컬 환경까지 소멸되는 것은 아니다. 클로저에 의해 참조되는 상위 스코프 변수(위 예제의 경우 outer 함수의 x=10)를 자유변수라고 부른다. 클로저를 조금 더 쉽게 번역하면 자유 변수에 묶여 있..

실행 컨텍스트는 자바스크립트 동작 원리를 담고 있는 핵심 개념이다. 실행 컨텍스트를 바르게 이해하면 자바스크립트가 스코프를 기반으로 식별자와 식별자에 바인딩된 값을 관리하는 방식과 호이스팅이 발생하는 이유, 클로저의 동작 방식, 그리고 태그스 큐와 함께 동작하는 이벤트 핸들러와 비동기 처리의 동작 방식을 이해할 수 있다. 23.2 소스코드의 평가와 실행 자바스크립트 엔진은 소스코드를 소스코드 평가와 소스코드의 실행 과정으로 나누어 처리한다. 소스코드 평가 과정에서는 실행 컨텍스트를 생성하고 변수, 함수 등의 선언문만 먼저 실행하여 생성된 변수나 함수 식별자를 키로 실행 컨텍스트가 관리하는 스코프에 등록한다. 이 후 선언문을 제외한 소스코드가 순차적으로 실행되기 시작하는데 이것이 런타임이 시작되는 것이다...

22.1 this 키워드 this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수이다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. 함수를 호출하면 arguments 객체와 this가 암묵적으로 함수 내부에서 전달되고 this는 지역 변수처럼 사용할 수 있다. 단 this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. 위와 같이 this는 함수가 호출되는 방식에 따라 this에 바인딩될 값, 즉 this 바인딩이 동적으로 결정된다. this는 객체의 메서드 내부 또는 생성자 함수 내부에서만 의미가 있고 일반 함수로 호출하면 함수 내부의 this에는 전역 객체 (window와 같은)가 바인..

21.1 자바스크립트 객체의 분류 자바스크립트 객체는 다음과 같이 크게 3개의 객체로 분류할 수 있다. 표준 빌트인 객체 - 표준 빌트인 객체는 ECMAScript 사양에 정의된 객체를 말하며 애플리케이션 전역의 공통 기능을 제공한다. 이는 자바스크립트 실행환경과 관계없이 언제나 사용할 수 있다. 표준 빌트인 객체는 전역 객체의 프로퍼티로서 제공된다. 따라서 별도의 선언 없이 전역 변수처럼 언제나 참조할 수 있다. 호스트 객체 - 호스트 객체는 ECMAScript 사양에 정의되어 있지 않지만 자바스크립트 실행 환경에서 추가로 제공하는 객체를 말한다. 브라우저 환경에서는 DOM, BOM, Canvas, XMLHttpRequest, Web Storage 등 과 같은 클라이언트 사이드 Web API를 호스트 ..

객체지향 프로그래밍 객체지향 프로그래밍은 프로그램을 명령어 또는 함수의 목록으로 보는 전통적인 명령형 프로그래밍의 절차지향적 관점에서 벗어나 여러 개의 독립적 단위, 즉 객체의 집합으로 프로그래밍을 표현하는 프로그래밍 패러다임을 말한다. 객체지향 프로그래밍은 실세계의 실체를 인식하는 철학적 사고를 프로그래밍에 접목하려는 시도에서 시작하는데 실체는 특징이나 성질을 나타내는 속성을 가지고 있고 이를 통해 실체를 인식하거나 구별할 수 있다. 위와 같이 객체의 상태를 나타내는 데이터와 상태 데이터를 동작을 하나의 논리적인 단위로 묶어 생각하는 것이 객체지향 프로그래밍이다. 19.2 상속과 프로토타입 자바스크립트는 프로토타입을 기반으로 상속을 구현하여 불필요한 중복을 제거한다. 위의 코드에서 getArea() 메..

18.1 일급 객체 일급 객체란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다. 일급 객체는 다음과 같은 조건을 만족해야한다. 무명의 리터럴로 생성할 수 있다. 즉 런타임에 생성이 가능하다. 변수나 자료구조에 저장할 수 있다. 함수의 매개변수에 전달할 수 있다. 함수의 반환값으로 사용할 수 있다. 일반 객체는 호출할 수 없지만 함수객체는 호출할 수 있으며 함수 객체는 일반 객체에는 없는 함수 고유의 프로퍼티를 소유한다. 18.2 함수 객체의 프로퍼티 console.dir 메서드를 사용하면 함수 객체 내부를 들여다볼 수 있다. 18.2.1 arguments 객체 선언된 매개변수의 개수와 함수를 호출할 때 전달하는 인수의 개수를 확인하지 않는 자바스크립트의 특성 때문에 함수가 호..

생성자 함수에 의한 객체 생성 객체를 생성할 수 있는 방법은 객체 리터럴과 생성자 함수를 사용하는 방식이 있다. 17.1 Object 생성자 함수 new연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. 이후 프로퍼티 또는 메서드를 추가하여 객체를 완성할 수 있다. 생성자 함수란 new 연산자와 함께 호출하여 객체를 생성하는 함수를 말한다. 생성자 함수에 의해 생성된 객체를 인스턴스라한다. 자바스크립트는 String, Boolean, Function, Array, Date등의 빌트인 생성자를 제공한다. String, Number, Boolean 빌트인 생성자 함수 Array, Date 생성자 함수 17.2.1 객체 리터럴에 의한 객체 생성 방식의 문제점 객체를 생성하는 방식은..

16.1 내부 슬롯과 내부 메서드 내부 슬롯과 내부 메서드는 자바스크릅티 엔젠의 구현 알고리즘을 설명하기 위해 ECMAScript 사앙에서 사용하는 의사 프로퍼티와 의사 메서드다. 16.2 프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 기본 값으로 자동 정의한다. 프로퍼티의 상태란 아래의 네가지를 말한다. 프로퍼티의 값 value 값의 갱신 가능 여부 writable 열거 가능 여부 enumerable 정의 가능 여부 configuration 프로퍼티 어트리뷰트는 자바스크립트 엔진이 관리하는 내부 상태 값이여서 직접 접근할 수 없지만 Object.getOwnPropertyDescriptor 메서드를 사용하여 간접적으..