클로저(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..

Object 생성자 함수 new연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환 빈 객체를 생성한 이후 프로퍼티 또는 메서드를 추가하여 객체 완성 // 빈 객체의 생성 const person = new Object(); // 프로퍼티 추가 person.name = "Lee"; person.sayHello = function () { console.log("Hi! My name is " + this.name); }; console.log(person); // {name:"Lee", sayHello:f} person.sayHello(); //Hi! My name is Lee 생성자 함수 new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수 인스턴스 생성자 함수에 의해 생성된..

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 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)을 통해 생성 함수 ..

원시 값과 객체의 비교 자바스크립트에서 제공하는 7가지 데이터 타입 숫자 문자열 불리언 null undefined 심벌 객체 타입 원시 타입과 객체 타입으로 구분 가능 데이터 타입을 원시 타입과 객체 타입으로 구분하는 이유는? 원시 타입의 값, 즉 원시 값은 변경 불가능한 값 객체(참조) 타입의 값, 즉 객체는 변경 가능한 값 원시 값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장된다. 이에 비해 객체를 변수에 할당하면 벼수(확보된 메모리 공간)에는 참조 값이 저장된다. 원시 값을 갖는 변수를 다른 변수에 할당하려면 원시 값이 복사되어 전달된다. 이를 값에 의한 전달이라고 한다. 이에 비해 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달된다. 이를 참조에 의..

데이터 타입 데이터 타입(줄여서 '타입'이라고 함)은 값의 종류를 말한다. 자바스크립트의 모든 값은 데이터 타입을 갖는다. 구분 데이터 타입 설명 원시 타입 숫자 타입 숫자, 정수와 실수 구분 없이 하나의 숫자 타입만 존재 문자열 타입 문자열 불리언 타입 논리적 참(true)와 거짓(false) undefined 타입 var 키워드로 선언된 변수에 암묵적으로 할당되는 값 null 타입 값이 없다는 것을 의도적으로 명시할 때 사용하는 값 심벌 타입 ES6에서 추가된7번째 타입 객체 타입 객체, 함수, 배열 등 숫자 탕비의 값 1과 문자열 타입의 값 '1'은 비슷해 보이지만 전혀 다른 값이다. 숫자 타입의 값은 주로 산술 연산을 위해 생성하지만 문자열 타입은 주로 텍스트를 화면에 출력하기 위해 생성한다. 확..

값(value) 값은 식(표현식)이 평가되어 생성된 결과, 변수에 할당하되는 것은 값 평가 식을 해석해서 값을 생성하거나 참조하는 것 // 10 + 20은 숫자 값 30을 생성한다. 10 + 20; //30 모든 값은 데이터 타입을 가지며, 메모리에 2진수, 즉 비트의 나열로 저장된다. 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석 가능 // 변수에는 10+20이 평가되어 생성된 숫자 값 30이 할당 관리 var sum = 10 + 20; 위 예제의 sum 변수에 할당 되는 것은 10 + 20이 아니라 결과 값인 30이다. 즉, 변수 이름 sum이 기억하는 메모리 공간에 저장된 것은 30이다. (10 + 20)은 할당 이전에 평가되어 값을 생성해야 한다. 위의 예제처럼 식으로 생성할 수 있지만 가..