JavaScript : 프로토 타입 기능을 넣을 곳

Question

나는이 두 접근법의 차이점을 알고 싶습니다. 그들은 둘 다 작동하지만 두 번째 접근법에 바람직하지 않은 영향이 있을지 이해하지 못합니다.

// A. Putting a prototype method outside the function declaration (what I would normally do) 
var Cat = function(){ 
} 

Cat.prototype.eat = function(){ 
    // implementation 
} 

// B. Putting a prototype method inside the function declaration (it works too but the scoping seems different) 
var Cat = function(){ 

    Cat.prototype.eat = function(){ 
     // implementation 
    } 
} 

Answer 1

모든 개체에는 프로토 타입이 있습니다.

function Animal() { 
    this.numLegs = 4; 
} 
function Cat() { 
    // Implementation 
} 
Cat.prototype = new Animal(); 

var kitten = new Cat(); 
console.log(kitten.numLegs); // 4 

또는 직접 현재 클래스의 프로토 타입 변수와 메소드를 추가 : 프로토 타입 상속은 하나 (고전 상속과 유사) 완전히 새로운 프로토 타입을 할당 할 수 있습니다

function Cat() { 
    // Implementation 
} 
Cat.prototype.numLegs = 4; 

var kitten = new Cat(); 
console.log(kitten.numLegs); // 4 

당신의 두 번째 예제는 Cat 클래스가 시작될 때마다 eat 함수를 Cat 프로토 타입에 간단히 재 할당합니다. 이는 유용하지 않지만 이전 값을 덮어 쓰므로 메모리를 차지하지 않습니다.

왜 유용합니까? 함수는 객체라는 것을 기억하십시오. 클래스의 모든 인스턴스에 대해 해당 클래스에 정의 된 각 변수와 함수는 자체 메모리를 사용합니다. 프로토 타입 상속을 사용하면 일반적인 방법을 공유 할 수 있으므로 각 인스턴스에 대한 추가 메모리를 차지하지 않습니다.

왜 이것이 유용하지 않습니까? 당신은 사적인 변수에 접근 할 수 없다. 또한 2 차 예 엉망이 무섭게 몇을 만들 때

Cat.feed = function(kittens) { 
    for (var kitten in kittens) { 
     kitten.eat(); 
    } 
}; 

Answer 2

첫 번째 예를 원할 수도 있습니다. 기술적으로는 두 번째 함수가 Cat의 "개인"변수에 액세스 할 수 있지만 둘 다 똑같은 작업을 수행하고 있습니다. 당신이 그렇게 할 경우, 그것을 할 수있는 올바른 방법 this을 사용하고 있습니다 :

var Cat = function(){ 
    var a = 'hi'; 

    this.eat = function() { 
     alert(a); // Exists! 
    } 
} 

는 위의 예와, 또는 원래의 "B"예로, 함수가 존재하지 않습니다 먹을 것을 명심하십시오 new Cat()으로 새 고양이를 인스턴스화 할 때까지 의미, 만약 당신이 방금 유틸리티 메서드처럼 Cat.eat() 함수를 호출하고 싶다면 prototype의 첫 번째 예제가 있습니다.