console.log("CAPABLE");

스프레드 문법(spread syntax)(전개 문법) ...은 하나로 뭉쳐 있는 열 값들의 집합을 펼쳐서 개별적인 값들의 목록을 만든다. Array, String, Map, Set, Dom 컬렉션(NodeList, HTMLCollection), arguments와 같이 for...of 문으로 순회할 수 있는 이터러블에 한정 // ...[1, 2, 3]은 [1, 2, 3]을 개별 요소로 분리한다.(->1, 2, 3) console.log(...[1, 2, 3]); // 1 2 3 // 문자열은 이터러블이다. console.log(..."Hello"); // H e l l o // Map과 Set은 이터러블이다. console.log( ...new Map([ ["a", "1"], ["b", "2"], ]) ..

클로저(closure) 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조함(출처: MDN) const x = 1; function outerFunc() { const x = 10; function innerFunc() { console.log(x); // 10 } innerFunc(); } outerFunc(); outerFunc 함수 내부에서 중첩 함수 innerFunc가 정의되고 호출되고 있다. 중첩 함수 innerFunc의 상위 스코프는 외부 함수 outerFunc의 스코프다. => 중첩 함수 innerFunc 내부에서 자신을 포함하고 있는 외부 함수 outerFunc의 x변수에 접근 가능 innerFunc 함수가 ou..

실행 컨텍스트 실행 컨텍스트를 제대로 이해하면 다음과 같은 내용을 이해할 수 있다. 스코프를 기반으로 식별자와 식별자에 바인딩 된 값(식별자 바인딩)을 관리하는 방식 호이스팅이 발생하는 이유 클로저의 동작 방식 태스크 큐와 함께 동작하는 이벤트 핸들러 비동기 처리의 동작 방식 소스코드 타입 ECMAScript 사양은 소스 코드를 4가지 타입으로 구분 4가지 타입의 소스코드는 실행 컨텍스트를 생성 소스코드의 타입 설명 전역 코드(global code) • 전역에 존재하는 소스코드. • 전역에 정의된 함수, 클래스 등의 내부 코드는 포함 x 함수 코드(function code) • 함수 내부에 존재하는 소스코드. • 함수 내부에 중첩된 함수, 클래스 등의 내부 코드는 포함 x eval 코드(eval code..

자바스크립트 객체의 분류 표준 빌트인 객체 ECMAScript 사양에 정의된 객체 언제나 사용 가능 표준 빌트인 객체는 전역 객체의 프로퍼티로서 제공 => 별도의 선언 없이 전역 변수처럼 언제나 참조 가능 호스트 객체 ECMAScript 사양에는 정의되어 있지 않지만 자바스크립트 실행 환경에서 추가로 제공되는 객체 사용자 정의 객체 표준 빌트인 객체와 호스트 객체처럼 기본 제공되는 객체가 아닌 사용자가 직접 정의한 객체 표준 빌트인 객체 Math, Reflect, JSON을 제외한 표준 빌트인 객체는 모두 인스턴스 생성 가능한 생성자 함수 객체 생성자 함수 객체인 표준 빌트인 객체는 프로토 타입 메서드와 정적 메서드를 제공하고 생성자 함수 객체가 아닌 표준 빌트인 객체는 정적 메서드만 제공 // Stri..

strict mode function foo() { x = 10; } foo(); console.log(x); // 10 \전역 스코프에도 x 변수의 선언이 존재하지 않기 때문에 ReferenceError를 발생할 것같지만 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. 이때 전역 객체의 x 프로퍼티는 마치 전역 변수처럼 사용 가능 위의 현상을 암묵적 전역이라고 한다. 잠재적인 오류를 발생시키기 어려운 개발 환경을 만들고 그 환경에서 개발하는 것이 해결책 이를 지원하기 위해 ES5부터 strict mode(엄격 모드)가 추가되었다. strict mode는 자바스크립트 언어의 문법을 더 엄격히 적용하여 오류 발생 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 ..

내부 슬롯과 내부 메서드 내부 슬롯과 내부 메서드는 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드다. ECMAScript 사양에 등장하는 이중 대괄호([[...])로 감싼 이름들이 내부 슬롯과 내부 메서드다. const o = {}; //내부 슬롯은 자바스크립트 엔진의 내부 로직이므로 직접 접근 x o.[[Prototype]] // -> Uncaught SyntaxError:unexpected token '[' // 단, 일부 내부 슬롯과 내부 메서드에 한하여 간접적으로 접근할 수 있는 수단 제공 o.__proto__ //-> object.prototype 프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 자바스크립트 엔진은 프로퍼티를 생..

var 키워드로 선언한 변수의 문제점 변수 중복 선언 허용 var 키워드로 선언한 변수는 중복 선언 가능 var x = 1; var y = 1; // var 키워드로 선언된 변수는 같은 스코프 내에서 중복 선언 허용 // 초기화문이 있는 변수 선언문은 자바스크립트 엔진에 의해 var 키워드가 없는 것처럼 동작 var x = 100; // 초기화문이 없는 변수 선언문은 무시 var y; console.log(x); //100 console.log(y); //1 var 키워드로 선언한 변수를 중복 선언하면 초기화문(변수 선언과 동시에 초기값을 할당하는 문) 유무에 따라 다르게 동작 초기화문이 있는 변수 선언문은 자바스크립트 엔진에 의해 var 키워드가 없는 것처럼 동작하고 초기화문이 없는 변수 선언문은 무시..

변수의 생명 주기 지역 변수의 생명 주기 변수는 선언에 의해 생성되고 할당을 통해 값을 갖는다. 변수는 생성되고 소멸된다. 변수는 자신이 선언된 위치에서 생성되고 소멸된다. 전역 변수의 생명 주기는 애플리케이션의 생명 주기와 같다. 함수 내부에서 선언된 지역 변수는 함수가 호출되면 생성되고 함수가 종료하면 소멸 function foo() { var x = "local"; console.log(x); //local return x; } foo(); console.log(x); //ReferenceError 지역 변수 x는 foo 함수가 호출되기 이전까지 생성x foo 함수를 호출하지 않으면 함수 내부의 변수 선언문이 실행x 변수 선언 선언문이 어디에 있든 상관 없이 가장 먼저 실행 런타임 이전 단계에서 자..

스코프 스코프(유효범위) 매개변수를 참조할 수 있는 유효 범위는 함수 몸체 내부에서만 참조할 수 있고 함수 몸체 외부에서 참조할 수 없다. 매개변수의 스코프가 함수 몸체 내부로 한정되기 때문이다. function add(x, y) { // 매개변수는 함수 몸체 내부에서만 참조 가능 // 즉, 매개변수의 스코프(유효범위)는 함수 몸체 내부 console.log(x, y); //2 5 return x + y; } add(2, 5); // 매개변수는 함수 몸체 내부에서만 참조 console.log(x, y); // ReferenceError: x is not defiend 변수는 코드의 가장 바깥 영역 뿐 아니라 코드 블록이나 함수 몸체 내에서도 선언 가능 (코드 블록이나 함수는 중첩될 수 있음) 스코프 모든..

함수 프로그래밍 언어의 함수도 수학의 함수와 같은 개념이다. 함수 f(x,y) = x+ y를 자바스크립트의 함수로 표현한 것 //f(x,y) = x+ y function add(x, y) { return x + y; } //(2, 5) = 7 add(2, 5); //7 함수 일련의 과정을 문으로 구현하고 코드 블록을 감싸서 하나의 실행 단위로 정의한 것 프로그래밍 언어의 함수도 입력을 받아서 출력을 내보낸다. 함수 내부로 입력을 받는 변수 → 매개변수(parameter) 입력 → 인수(argument) 출력 → 반환값(return value) 함수는 값이며, 여러 개 존재 가능! 특정 함수를 구별하기 위해 식별자인 함수 이름을 사용 함수는 함수 정의(function definiton)을 통해 생성 함수 ..