리터럴 표기법에 의해 생성된 객체의 생성자 함수와 프로토타입생성자 함수에 의해 생성된 인스턴스는 프로토타입의 constructor 프로퍼티에 의해 생성자 함수와 연결된다. constructor 프로퍼티가 가리키는 생성자 함수는 인스턴스를 생성한 생성자 함수다.const obj = new Object();console.log(obj.constructor === Object); // trueconst add = new Function('a', 'b', 'return a + b');console.log(add.constructor === Function); // trueconst Person(name) { this.name = name;}const me = new Person("Jung");console.l..

객체 지향 프로그래밍자바스크립트는 함수형, 명령형, 프로토타입 기반의 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어다. 그 중 객체지향 프로그래밍(OOP, Object Oriented Programming)은 프로그램을 명령어 또는 함수의 목록으로 보는 전통적인 명령형 프로그래밍의 절차지향적 관점에서 벗어나 여러 개의 독립적 단위인 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임이다. 객체지향 프로그래밍에서는, 현실 세계에 존재하는 실체를 그것의 특징, 성질과 같은 속성(property)으로 인식하는 것과 마찬가지로 여러 가지의 속성을 통해 하나의 객체를 다른 것과 구별할 수 있다. 즉, 객체란 속성을 통해 여러 개의 값을 하나의 단위로 구성한 복합적인 자료구조다. 사람에게는 이름..

일급 객체일급 객체는 다음과 같은 네 가지 조건을 모두 만족하는 객체를 말한다.무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다.변수나 자료구조(객체, 배열)에 저장할 수 있다.함수의 매개변수에 전달할 수 있다.함수의 반환값으로 사용할 수 있다.자바스크립트의 함수는 위의 조건을 모두 만족하므로, 자바스크립트의 함수는 일급 객체다. 함수가 일급 객체라는 것은 함수를 객체와 동일하게 사용할 수 있다는 것으로, 함수는 값과 동일하게 취급할 수 있다.자바스크립트의 함수가 일반 객체와 마찬가지로 함수의 매개변수에 전달할 수 있으며, 함수의 반환값으로 사용할 수도 있다는 것은 함수형 프로그래밍을 가능케 하는 자바스크립트의 장점 중 하나다.함수는 객체이지만, 일반 객체와는 다르게 호출할 수 있으며 일반..

Object 생성자 함수new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다.생성자 함수(constructor)란 new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다. 생성자 함수에 의해 생성된 객체를 인스턴스(instance)라 한다.자바스크립트는 Object 생성자 함수 이외에도 String, Number, Boolean, Function, Array, Date, ReqExp, Promise 등의 빌트인 생성자 함수를 제공한다.const person = new Object(); // {}person.name = 'Jung';console.log(person); // {name: "Jung"}const strObj = new String('Jung')..

객체 변경 방지객체는 변경 가능한 값으로, 재할당 없이 직접 변경할 수 있다. 자바스크립트는 객체의 변경을 방지하는 다양한 메서드를 제공하며, 메서드들은 객체의 변경을 금지하는 강도가 다르다.구분메서드프로퍼티추가프로퍼티삭제프로퍼티값 읽기프로퍼티값 쓰기프로퍼티 어트리뷰트재정의객체 확장 금지Object.preventExtensionsXOOOO객체 밀봉Object.sealXXOOX객체 동결Object.freezeXXOXX 객체 확장 금지Object.preventExtensions 메서드는 객체의 확장을 금지, 즉, 프로퍼티 추가를 금지한다. 프로퍼티 동적 추가와 Object.defineProperty 메서드 두 가지 추가 방법이 모두 금지된다. 확장이 가능한 객체인지 여부는 Object.isExtensible..

내부 슬롯과 내부 메서드내부 슬롯(inner slot)과 내부 메서드(internal method)는 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티(pseudo property)와 의사 메서드(pseudo method)다. ECMAScript 사양에 등장하는 이중 대괄호([[...]])로 감싼 이름들이 내부 슬롯과 내부 메서드다.내부 슬롯과 내부 메서드는 자바스크립트 엔진의 내부 로직으로, 원칙적으로 자바스크립트는 내부 슬롯과 내부 메서드에 직접적으로 접근하거나 호출할 수 있는 방법을 제공하지 않는다. 일부 내부 슬롯과 내부 메서드에 한하여 간접적으로 접근할 수 있는 수단을 제공한다. 예를 들어 모든 객체는 [[Prototype]]이라는 내부 슬롯을..

var 키워드로 선언한 변수의 문제점변수 중복 선언 허용var x = 1;var y = 1;// 중복 선언 허용var x = 100; // 초기화문이 있는 변수 선언문: 자바스크립트 엔진에 의해 var 키워드가 없는 것처럼 동작var y; // 초기화문이 없는 변수 선언문: 무시됨console.log(x); // 100console.log(y); // 1위 예제와 같이 var 키워드로 선언한 변수는 같은 스코프 안에서도 중복 선언이 가능하고 초기화문 유무에 따라 다르게 동작한다. 만약 동일한 이름의 변수가 있는지 모르고 변수를 중복 선언하면 의도하지 않은 결과를 초래할 수 있다. 함수 레벨 스코프var 키워드로 선언한 변수는 오로지 함수의 코드 블록만을 지역 스코프로 인정하므로, 함수 외부에서..

변수의 생명 주기지역 변수의 생명 주기변수는 선언에 의해 생성되고 할당을 통해 값을 가지며 언젠가 소멸하는, 생물과 유사하게 생명 주기(life cycle)가 있다. 변수는 자신이 선언된 위치에서 생성되고 소멸한다. 그러나 함수 내부에서 선언된 지역 변수는 함수가 호출되면 생성되고 함수가 종료되면 소멸한다. function foo() { var x = 'local'; console.log(x); return x;}foo();console.log(x); // RefereceError: x is not defined지역 변수 x는 foo 함수가 호출되기 이전까지는 생성되지 않는다. foo 함수를 호출하지 않으면 함수 내부의 변수 선언문이 실행되지 않기 때문이다. 변수 호이스팅에서 알아보았듯이 변수 선언..

스코프란?모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정된다. 이 것을 스코프(scope, 유효범위)라 한다. 즉, 스코프란 식별자가 유효한 범위를 의미한다. 자바스크립트의 스코프는 다른 언어의 스코프와 구별되는 특징이 있으므로 주의가 필요하다.var x = 'global';function foo() { var x = 'local'; console.log(x); // ①}foo();console.log(x); // ②위의 예제에서 코드의 가장 바깥 영역과 foo 함수 내부에 같은 이름을 갖는 x 변수를 선언했고, ①, ②에서 x 변수를 참조한다. 이때 자바스크립트 엔진은 각 코드에서 이름이 같은 두 개의 ..

즉시 실행 함수함수 정의와 동시에 즉시 호출되는 함수를 즉시 실행 함수(IIFE, Immediately Invoked Function Expression)라고 한다. 즉시 실행 함수는 단 한 번만 호출되며 다시 호출할 수 없다. 일반적으로 익명함수로 사용하며, 기명함수로 사용하더라도 그룹 연산자 내의 기명 함수는 함수 리터럴로 평가되어 함수 이름은 함수 몸체에서만 참조할 수 있다.(function foo() { return "Hello!";}());foo(); // ReferenceError: foo is not defined즉시 실행 함수는 반드시 그룹 연산자 (...)로 감싸야 한다. 만약 그룹 연산자로 감싸지 않은 경우 어떻게 되는지 아래 예제를 통해 살펴보자.// 1. 익명 즉시 실행 함수를 그..