JavaScript에서 확장/재정의 하시겠습니까?

Question

JavaScript 및 <canvas>을 사용하여 작은 게임을 만들고 싶지만 먼저 "올바른"또는 적어도 일반적인 방식으로 Object 작업을하고 싶습니다.

하나의 주제 나는 특히 overriding 메서드를 구현할 수있는 방법을 이해하는 데 문제가 있습니다. 내가 개체를 만들 때

, 나는이있을 수 있습니다 :

function AnotherObject() 
{ 
    var base = new MyObject(); 

    base.j = 0; 

    return base; 
} 

내가 원하는 : 나는 같은 멤버로 시작해야 다른 개체를 만들 때

function MyObject() 
{ 
    var base = {}; 

    base.i = 0; 
    base.update = function() 
    { 
     base.i ++; 
    } 

    return base; 
} 

을 다음, 나는 이것을 사용 AnotherObject.update()에 콘텐츠를 추가하면서 내가 가지고있는 논리를 계속 실행하면서 MyObject.update()을 입력하면 AnotherObject() :

그럼 물론 내가 추가 한 논리를 잃어 버리는데 MyObject.update().

MyObject으로 정의 된 원래 update() 메서드를 호출하기 위해 AnotherObject.update()을 어떻게 쓸 수 있습니까?

Answer 1

먼저이 우수한 excellent MDN article을 읽어 보시기 바랍니다. 그것은 당신을 계몽 할 것입니다.

이 방법을 서브 클래스 달성 할 수있다 : 다른 사람이 당신이 프로토 타입 기반 상속을 따라야 제안

function MyObject() { 
    this.i = 0; 
} 

MyObject.prototype.update = function() { 
    this.i++; 
} 

function AnotherObject() { 
    MyObject.call(this); 
    this.j = 0; 
} 

AnotherObject.prototype = new MyObject; 

AnotherObject.prototype.constructor = AnotherObject; 

AnotherObject.prototype.update = function() { 
    MyObject.prototype.update.call(this); 
    this.j++; 
} 

obj = new AnotherObject(); 
console.log(obj.i); //0 
console.log(obj.j); //0 

obj.update(); 
console.log(obj.i); //1 
console.log(obj.j); //1 

console.log(obj instanceof MyObject) //true 
console.log(obj instanceof AnotherObject) //true 

Answer 2

+1 zzzzBov의 의견입니다. prototype을 사용해야하는 경우 base을 사용 중입니다. 생성자 함수 내에 있지 않고 생성자 함수 다음에 클래스 정의를 더 구체화합니다.

Answer 3

function MyObject() { 
    this.value = 5; 
} 
MyObject.prototype.update = function() { 
    this.value++; 
} 
Var newObject = new MyObject(); 
newObject.update =function() { 
    value--; 
} 

Answer 4

으로. 그것이 올바른 방법입니다.

그러나

는 지금까지 무엇을했는지에 대한 해결책으로 당신은 당신은 객체의 프로토 타입을 사용하는 방법을 배울 필요가

function MyObject() { 
    var base = {}; 
    base.i = 0; 
    base.update = function() { 
     this.i++; 
    } 
    base.show = function() { 
     console.log("i is " + this.i); 
    } 
    return base; 
} 

function AnotherObject() { 
    var base = new MyObject(); 
    base.j = 0; 
    var update = base.update; // proxy variable that refers to original `update` 
    base.update = function() { 
     update.call(this); // invoke original `update` 
     this.j++; 
    } 
    var show = base.show; // proxy variable that refers to original `show` 
    base.show = function() { 
     show.call(this); // invoke original `show` 
     console.log("j is " + this.j); 
    } 
    return base; 
} 

var t = AnotherObject(); 
t.update(); 
t.show();