자바 스크립트 - 생성 된 두 번째 개체가 첫 번째 개체와 다릅니다

여기에 부모 클래스 Shape이 있고 그 자식은 Rectangle입니다. 몇 가지 Rectangle 개체 문제가 발생하면 - 먼저 하나의 개체가 draw이지만 다른 개체는 없습니다. 또한 다른 유형도 있습니다 (Object 대 Shape)자바 스크립트 - 생성 된 두 번째 개체가 첫 번째 개체와 다릅니다

왜 이런 일이 발생합니까? 여기

오류

입니다 그리고 여기

function Shape(center){ 
    this.center = center; 
    this.angle = 0; 
}

코드

index.html

<html> 
    <head> 
     <title>TODO supply a title</title> 

    </head> 
    <body>   
     <div>TODO write content</div> 
    <script type="text/javascript" src="Rect.js"></script> 
    <script type="text/javascript" src="Shape.js"></script> 
    <script type="text/javascript" src="Main.js"></script> 
    </body> 
</html>

에게 R Shape.js

입니다 ect.js

var Rectangle = function(center, width,height){ 
    Shape.call(this, center); 
    this.mType = "Rectangle"; 
    this.mWidth = width; 
    this.mHeight = height; 

    var prototype = Object.create(Shape.prototype); 
    prototype.constructor = Rectangle; 
    Rectangle.prototype = prototype; 
}; 

Rectangle.prototype.draw = function() { 
//for the test 
    console.log("Rect is drawn"); 
};

출처

2017-03-09 DanilGholtsman

마다의 예를 참조하십시오. 그러나'Rectangle.prototype.draw' 만 정의했습니다. – Barmar

@Barmar 따라서 처음으로'draw'에 이르렀습니다. 그러나 생성자 함수 만 호출 한 후에 생성 되었습니까? – DanilGholtsman

문제는 Rectangle 생성자를 호출 할 때마다 이전 Rectangle.prototype을 새로 작성한다는 것입니다. 그러나 첫 번째 Rectangle.prototype에 draw 메서드 만 추가했습니다.

생성자에 프로토 타입 체인을 만들어서는 안되므로 한 번 설정해야합니다.

function Shape(center){ 
 
    this.center = center; 
 
    this.angle = 0; 
 
} 
 

 
function Rectangle(center, width,height){ 
 
    Shape.call(this, center); 
 
    this.mType = "Rectangle"; 
 
    this.mWidth = width; 
 
    this.mHeight = height; 
 
}; 
 

 
Rectangle.prototype = Object.create(Shape.prototype); 
 

 
Rectangle.prototype.draw = function() { 
 
//for the test 
 
    console.log("Rect is drawn"); 
 
}; 
 

 
Rectangle.prototype.constructor = Rectangle; 
 

 
var up = new Rectangle(1, 1, 3); 
 
var down = new Rectangle(2, 1, 3); 
 

 
up.draw(); 
 
down.draw(); 
 
console.log(Shape.prototype.isPrototypeOf(up)); 
 
console.log(down instanceof Shape);

는 새로운`prototype`을 작성, 당신은`Rectangle` 만들 Inheritance and the prototype chain

출처

2017-03-09 07:26:40 Barmar

오, 이제 알 겠어요! 고마워요 – DanilGholtsman

하지만'up.isPrototypeOf (Shape);'(또는)'down.isPrototypeOf (Shape);을 시도 할 때 여전히'false'라고합니다. 왜? –

Shape.isPrototypeOf (위)' – Barmar

사실 당신은 제거 (또는) 이전 라인의 '역'을 할 어디 Rect.js 파일에 Rectangle.prototype = prototype; 문을 언급 할 필요가있다.

Rect.js이 도움이

var Rectangle = function(center, width,height){ 
    Shape.call(this, center); 
    this.mType = "Rectangle"; 
    this.mWidth = width; 
    this.mHeight = height; 

    var prototype = Object.create(Shape.prototype); 
    prototype.constructor = Rectangle; 

    // Comment the below line, to make your code work. 
    //Rectangle.prototype = prototype; 
};

희망!

출처

2017-03-09 07:15:45

그가 이것을하면 'Rect'에게 'Shape'을 어떻게 상속 받습니까? – Barmar

안녕하세요 Barmar, 내 대답은 더 이상 오류를 제거하는쪽으로 –

그리고 우리가'up.isPrototypeOf (Shape);'(또는)을 시도 할 때 대답 (또는) 내 'Rectangle.prototype ...')'down.isPrototypeOf (Shape);'여전히 false로 표시됩니다. –

자바 스크립트 - 생성 된 두 번째 개체가 첫 번째 개체와 다릅니다

답변

관련 문제