목록모던 자바스크립트 deep dive (26)
fffo
빌트인 객체 js 객체의 분류 js 객체는 크게 3개로 분류할 수 있음 표준 빌트인 객체(standard built-in / native / global objects) ECMAScript 사양에 정의된 객체 호스트 객체(host objects) ECMAScript 사양에 정의되어 있지 않지만 js 실행환경(브라우저 환경 또는 node.js환경)에서 추가로 제공하는 객체 사용자 정의 객체(user-defined objects) 사용자가 직접 정의한 객체 표준 빌트인 객체 Math, Reflect, JSON을 제외한 모든 표준 빌트인 객체는 생성자 함수 객체이고 프로토타입 메서드와 정적 메서드를 제공함 생성자 함수가 아닌 표준 빌트인 객체는 정적 메서드만 제공함 const numObj = new Numbe..
strict mode strict mode란? js의 문법을 좀 더 엄격히 적용하여 오류 발생 가능성을 줄이고 js엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킴 ES5부터 지원, ES6에서 도입된 클래스와 모듈은 기본적으로 strict mode가 적용됨 암묵적 전역 변수 선언 시 스코프체인 종점에 도달했을 때까지 해당 변수를 찾지 못하면 js엔진이 암묵적으로 전역 객체에 해당 변수 값을 가지는 프로퍼티를 동적으로 생성함 유저가 의도하지 않은 오류를 발생 시킬 수 있음 ESlint strict mode에서 제한하는 오류 + 코딩 컨벤션을 설정 파일 형태로 정의하고 강제할 수 있는 도구 strict mode보다 강력하기 때문에 ESlint 사용을 권장 strict mode..
프로토타입 js는 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어임 객체지향 프로그래밍 명령형 프로그래밍 : 프로그램을 명령어나 함수의 목록으로 보는 전통적인 관점 객체지향 프로그래밍 : 여러 개의 독립적인 단위(객체)의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임 실세계의 실체를 인식하는 사고를 프로그래밍에 접목시키고자 함 속성 : 실체는 특징이나 성질을 나타냄 추상화 : 속성을 프로그램에 필요한 부분만 간추려내 표현 객체 : 속성을 통해 여러 개의 값을 하나의 단위로 구성한 복합적 자료구조. 상태(property)와 동작(method)을 하나의 논리적 단위로 묶음 상속과 프로토타입 상속 : 객체의 프로퍼티나 메서드를 다른 객체가 상속 받아 그대로 사..
함수의 일급 객체 일급 객체의 조건 무명의 리터럴로 생성 가능(런타임에 생성 가능) 변수나 자료구조(객체, 배열 등)에 저장 가능 함수의 매개변수에 전달 가능 함수의 반환값으로 사용 가능 함수 객체의 프로퍼티 arguments 함수 호출 시 전달된 인수의 정보를 담고 있는 유사 배열 객체이자 이터러블 자료구조 함수 내부에서 지역 변수처럼 사용, 외부에서 참조 불가 arguments 프로퍼티로서 사용하는 방법은 ES3부터 표준에서 폐지됨. 함수 내부에서 지역 변수처럼만 사용 권장 js는 선언된 매개변수의 개수와 함수 호출 시 전달되는 인수의 개수를 확인하지 않으므로 인수 개수를 확인하는 동작 시 arguments 객체를 활용. 가변 인자 함수 구현 용이 ES6에서 나온 Rest 파라미터로 가변 인자 함수 ..
생성자 함수에 의한 객체 생성 Object 생성자 함수 빌트인 생성자 함수를 이용해 객체(인스턴스)를 생성 특별한 이유가 없다면 그리 유용하진 않음 생성자 함수 객체 리터럴에 의해 의한 객체 생성은 생성의 재사용이 어려움 생성자 함수는 프로퍼티 구조가 동일한 객체 생성에 재사용 용이 function People(name) { this.name = name; this.greeting = function() { return `Hi. I'm ${name}.` }; } const p1 = new People('dlwlrma'); const p2 = new People('BDNS'); p2.skill = function() { return 'Bouncy bouncy ~~~'; } console.log(p1.gre..
프로퍼티 어트리뷰트 내부 슬롯과 내부 메서드 js 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사(pseudo) 프로퍼티와 의사 메서드임 이중 대괄호[[...]]로 감싸서 표현 js엔진에서 실제로 동작하지만 개발자가 직접 접근할 수는 없음 → 간접적 접근이 가능한 일부 내부 슬롯과 내부 메서드 존재 ([[Prototype]]을 proto를 통해 접근 가능) 프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 js 엔진은 프로퍼티를 생성할 때 프로퍼티 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동 정의함 프로퍼티 어트리뷰트는 js 엔진이 관리하는 내부 상태 값(meta-property)인 내부 슬롯들로 이루어짐 프로퍼티 어트리뷰트에 직접 접근할 수 없지만 Object.ge..
전역 변수의 문제점 변수의 생명 주기 변수가 런타임 이전에 선언되는 것은 전역변수 한정 지역 변수는 해당 스코프가 실행 될 때 선언되고 스코프가 끝날 때 소멸 됨 변수가 할당된 메모리 공간은 누군가가 참조하고 있지 않을 때 가비지 콜랙터에 의해 해제 됨 → 누군가 참조하고 있다면 해제되지 않고 남아있음 일반적으로 함수가 종료되면 함수가 생성한 스코프도 소멸하지만 누군가 스코프를 참조하고 있으면 스코프는 해제되지 않고 생존 → 클로저 전역 객체 전역 객체 : 코드가 실행되기 이전 단계에 js엔진에 의해 어떤 객체보다도 먼저 생성되는 특수한 객체 브라우저 : window node.js : global 환경에 따라 전역 객체를 가리키는 다양한 식별자(window, self, this, frames, globa..
스코프 스코프 : 식별자가 유효한 범위 식별자는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정됨 스코프는 js 엔진이 식별자를 검색 할 때 사용하는 규칙이라고도 볼 수 있음 스코프 내에서 식별자는 유일해야하지만 다른 스코프에는 같은 이름의 식별자 사용 가능 → 스코프는 네임스페이스라고 볼 수 있음 전역과 지역으로 나뉨 렉시컬 환경(lexical environment) 코드가 어디서 실행되며 주변에 어떤 코드가 있는 지를 말함 코드의 문맥(constext)은 렉시컬 환경으로 이루어 짐 이를 구현한 것이 실행 컨텍스트(execution context) 모든 코드는 실행 컨텍스트에서 평가되고 실행됨 스코프 체인 함수의 중첩 : 함수 몸체 내부에서 함수 정의 중첩 함수 ..