prototype link

자바스크립트에서 모든 객체는 자신을 생성한 생성자 함수의 prototype 프로퍼티가 가리키는 프로토타입 객체를 자신의 부모 객체로 설정하는 prototype 링크로 연결한다

즉 prototype 프로퍼티는 함수의 입장에서 자신과 링크된 프로토타입 객체를 기리키고 있다
prototye 링크는 객체의 입장에서 자신의 부모 객체인 프로토타입 객체를 내부의 숨겨진 링크로 가리키고 있다

prototype chainning

자바 스크립트에서 특정 객체의 프로퍼티나 메서드에 접근하려고 할 때 해당 객체에 접근하려는 프로퍼티 또는 메서드가 없다면 prototype 링크를 따라 자신의 부모 역할을 하는 프로토타입 객체의 프로퍼티를 차례대로 검색하는 것

Object.prototype객체는 프로토타입 체이닝의 종점이다.

ECMAScript 명세서에는 자바스크립트의 각 네이티브 객체별로 공통으로 제공해야하는 메서드들을 각각의 프로토타입 객체 내에 메서드로 정의해야한다 라고 기술되어 있다. 그렇기 때문에 프로토타입 객체 내에 메서드를 정의할 수 있다.

프로토타입 객체도 자바스크립트 객체이므로 동적으로 프로퍼티를 추가하고 삭제하는것이 가능하다.

디폴트 프로토타입은 다른 객체로 변경이 가능하고 변경된 시점 이후에 생성된 객체들은 변경된 프로토타입 객체로 prototype 링크를 연결한다.

객체의 프로퍼티를 읽거나 메서드를 실행할 때만 프로토타입 체이닝이 동작한다. 즉 쓰기에서는 프로토타입 체이닝은 동작하지 않는다.

String.prototype.testMethod = function () {
    console.log('This is the String.prototype.testMethod()');
};

//str 은 String.prototype를 부모 프로퍼티로 가지게 되어 프로토타입 체이닝에 의해 testMethod()의 호출이 가능하다
var str = "this is  test";
str.testMethod();

console.dir(String.prototype);

프로토타입 객체 메서드의 this 바인딩

프로토타입 객체 메서드의 this 바인딩은 자신을 호출한 객체가 this에 바인딩 된다

function Person(name) {
    this.name = name;
}

Person.prototype.getName = function () {
    return this.name;
};

var foo = new Person('foo');

console.log(foo.getName()); //foo

Person.prototype.name = 'person';

console.log(Person.prototype.getName());    //person