22-1. this 키워드 객체는 객체의 상태를 나타내는 프로퍼티와 그 상태를 참조하고 수정할 수 있는 메서드로 이루어진 논리적인 자료 구조라고 배웠다. 여기서 동작을 나타내는 메서드는 자신이 속한 객체의 프로퍼티를 참조할 수 있어야 하는데, 이떄는 먼저 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야 한다. 문제는 생성자 함수인데, 다음 경우를 살펴보자 function Circle(radius){ ????.radius = radius; } Circle.prototype.getDiameter = function(){ // 이 시점에서는 생성자 함수 자신이 생성할 인스턴스를 가리키는 식별자를 알 수 없다. return 2 * ????.radius; }; // 생성자 함수로 인스턴스를 생성하려면 먼저..
19-10. instanceof 연산자 객체 instanceof 생성자 함수 우변의 생성자 함수의 prototype에 바인딩된 객체가 좌변의 객체의 프로토타입 체인 상에 존재하면 true, 아니라면 false 로 평가된다. 예제로 살펴보자 // 생성자 함수 function Person(name) { this.name = name; } const me = new Person('Lee'); // 프로토타입으로 교체할 객체 const parent = {}; // 프로토타입으로 교체 Object.setPrototypeOf(me, parent); console.log(Person.prototype === parent); // false console.log(parent.constructor === Person);..
저번 프로토타입의 기본 개념에 이어서 포스팅을 이어가보자 19-5. 프로토타입의 생성 시점 프로토타입은 생성자 함수가 생성되는 시점에 더불어 생성된다. 계속해서 이어지는 내용인데, 결국 생성된 객체와 생성자 함수, 그리고 프로토타입 객체는 모두 유기적으로 연결되어 있기 때문이다. 생성자 함수가 이미 빌트인으로 주어지는 것이 있고(예를 들면 Object, Array....) 우리가 직접 생성자 함수를 만드는 경우가 있다. 이 경우 프로토타입은 언제 생성이 될까? 차이점이 있을 것 같다. 우선 우리가 직접 생성자 함수를 만드는 경우를 예를 들어보자 console.log(Person.prototype); // { constructor: f } // 생성자 함수 function Person(name){ this..
자바스크립트는 클래스 기반 객체지향 프로그래밍 언어보다 효율적이며 더 강력한 프로그래밍 능력을 지니고 있는 프로토타입 기반의 객체지향 프로그래밍 언어라고 한다. 문장 자체가 좀 와닫진 않았지만 자바스크립트가 객체지향 언어라는 점이라는 사실을 듣기는 하였지만, 그 이유에 대해서 잘 파악하지 못하였는데, 이번 기회에 좀 더 자세히 알아보려고 한다. 사실 이전부터 자바스크립트에 대해선 명령형 언어라고 파악하고 있었는데, 실상은 명령형, 함수형, 프로토타입 기반, 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어라고 하니.... 알아야 할 것들이 점점 더 늘어나는 느낌이다. 19-1. 객체지향 프로그래밍 객체 지향 프로그래밍은 여러개의 독립적 단위, 즉 객체의 집합으로 프로그램을 표현하려 하는 프로그..
13-1 스코프 스코프(scope): 유효범위, 스코프는 특히 자바스크립트 내에서 변수 var 와 let, const 와의 구별에 밀접한 관계가 있다. 여기서 유효범위는 이전에 함수를 다루면서 경험한 적이 있는데, 함수의 매개변수는 함수 몸체 외부에서는 참조 할 수 없다고 했었다. 즉, 매개변수의 유효범위가 함수 몸체인것이다. 함수 매개변수는 함수 내에서 선언이 되었다. 변수가 함수 내에서 선언이 되었다는 것은, 아니 이렇게 표현하게 되는 이유가 있는데, 변수를 포함한 식별자가 어디에서 어느 위치에서 선언되는지에 따라 그 변수를 참조할 수 있는 범위가 결정되기 때문이다. 즉, 모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유..
12-1. 함수 객체와 더불어 함수는 자바스크립트의 핵심이자, 스코프, 실행 컨텍스트, 클로저, 프로토타입 등 모두 함수와 관련이 있다. 우리가 알고 있는 수학에서의 함수는 결국 입력(input) 을 받아 출력(output) 을 내보내는 과정이다. function add(x, y) { return x + y; } add(2,5); // 7 x, y 를 입력받아 내부 과정을 통해 x+y 를 출력한다. 위 표현방법은 자바스크립트에서의 함수 표현방법이다. 자바스크립트에서 함수는 일련의 과정을 문(statement)으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것이다. 위 그림을 참고하여, 함수는 내부로 입력을 전달받는 매개변수(parameter), 입력을 인수(argument), 출력을 반환값..
자바스크립트내 타입은 크게 원시타입(primitive type) 과 객체타입(object/reference type) 으로 나뉜다고 배웠다. 앞에서 계속해서 원시타입값들에 대해 다루어봤고, 객체타입으로 따로 나뉜다는 것 자체부터 자바스크립트에서 객체 타입이 차지하는 비중이 작지 않다는 것을 유추할 수 있다. 이 두가지 타입의 차이점을 요약하면 크게 3가지로 나눌 수 있다. 원시 값은 변경 불가능한 값(immutable value)이다. 반대로 객체는 변경이 가능한 값(mutable value) 이다. 원시 값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장된다. 반면 객체를 변수에 할당하면(확보된 메모리공간)에서는 참조 값이 저장된다. 원시값을 가지는 변수를 다른 변수에 할당하면 원시값이..
10-1. 객체란? 자바스크립트를 공부해오면서 정말로 많이 들었던 말이 객체라는 단어다. 이유는 잘 몰랐지만 객체기반의 프로그래밍 언어라고 알고 있었고, 자바스크립트를 구성하는 거진 모든 것이 객체라고 한다. (원시값을 제외한 나머지 값이 객체) 그렇다면 객체는 무엇일까? 원시 타입은 단 하나의 값만 나타내지만 객체 타입은 다양한 타입의 값 (원시 값 또는 다른 객체)을 하나의 단위로 구성한 복합적인 자료구조(data structure)라고 한다. 객체 내부값은 변경이 가능한데, 이는 11장에서 좀 더 자세히 다뤄보도록 하자. 객체는 0개 이상의 프로퍼티로 구성된 집합이며, 프로퍼티는 키(key) 와 값(value) 로 구성된다. 자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티 값이 될 수 있다. 위..
