Prototype 이란?
javascript는 prototype based language, 프로토타입 기반 언어입니다
prototype은 단어적 의미로 원형이라는 뜻이며, 객체들이 공통으로 사용하는 속성값을 의미합니다 . 객체 지향 프로그래밍에서는 Class의 method를 지정해주기 위해 쓰입니다!
생성자(constructor) 함수 밖에서 메소드를 정의해주지만 생성자 함수로 만든 모든 객체에 사용할 수 있어요
prototype 만들기
// 1. pseudoClassical
var Car = function(brand, name, color) {
this.brand = brand;
this.name = name;
this.color = color;
}
// prototype으로 메소드 정의
Car.prototype.move = function () {
console.log (this.name + ' 출발합니다!');
}
// 인스턴스 만들기
var avante = new Car('hyundai','avante','gray')
// 2. ES6 class키워드
class Car() {
constructor(brand, name, color) {
this.brand = brand;
this.name = name;
this.color = color;
}
move() {
console.log (this.name + ' 출발합니다!');
}
}
var mini = new Car('bmw', 'mini', 'red');
mini.move(); // mini 출발합니다!prototype을 이용하지 않고 생성자 함수 내에서 함수를 선언하면 어떤 비효율이 생기는가?
prototype이 없다면 생성자 함수 안에 함수를 정의해야 하는데 새로운 객체를 생성할 때마다 함수를 정의해야 하므로 메모리가 낭비됩니다.(1억개가 있다고 하면 너무 비효율)
( 해당 객체는 그 함수를 실행할 필요할 필요가 없음에도, 그 함수를 가지고 있는 상태가 됨)
prototype을 이용해서 어떻게 극복가능?에서도 해당 메소드를 이용할 수 있음. (Polymorphism)
만약, prototype을 이용하여, 원형 객체에 메소드를 정의할 경우, 원형 객체에 한번만 정의를 해 놓으면 constructor로 생성된 객체에서 해당 메소드의 메모리주소를 참조하여 메모리 손실이 줄어듭니다.
prototype에 정의된 메소드를 호출하면 어떤 순서로 실행되나?
- 그 객체 자신이 함수를 가지고 있는지 찾음
- 없으면, 원형객체(상위객체)에서 해당 이름으로 메소드가 정의되어 있는지 찾음
1억개의 객체가 있을때 하나의 객체에 같은이름의 함수를 다른내용으로 정의해도 그 수정한 객체에만 영향있을뿐 다른 객체에는 영향이 가지 않습니다.
왜냐하면 객체.함수() 를 실행할때에는 그 객체 자신 안에 함수가 있는지 '먼저' 확인하고 실행하기 때문입니다.
Prototype Chain
객체가 자신이 가지고 있지 않은 기능을 호출할때, __proto__ 에 있는 상위객체의 프로토타입을 참조합니다.
생성자로 만들어진 객체에서 해당 객체에 없는 함수를 호출할때 객체 프로퍼티 __proto__ 를통해서 부모 prototype 객체에서 메소드를 찾아 호출합니다. 그러므로 부모에서 prototype 프로퍼티는 따로 prototype객체를 두어 바로 자식 객체에서 호출할때 부를수 있도록 만들고 자식 __proto__ 경우는 부모 prototype으로 연결하여 부모 프로퍼티, 메소드를 호출할수 있도록합니다.
Person === Person.prototype.constructor
kim.__proto__ === Person.prototype
