Javascript OOP 프로토 타입 상속

Question

JS OOP, 특히 프로토 타입 상속을 연습하려고하는데이 JS Fiddle이 정의되지 않은 이유를 알 수 없습니다. 아래 코드 :

function Shape(name, edges) { 
    this.Name = name; 
    this.Edges = edges; 
} 

Shape.prototype.toString = function(){ return "Shape: " + this.Name;}; 

function Circle(radius) { 
    this.Radius = radius; 
} 

Circle.prototype.Area = function(){ 
    return Math.PI * Math.pow(this.Radius, 2); 
}; 

Circle.prototype = new Shape("Circle", 1); 
Circle.prototype.constructor = Circle; 

var circle = new Circle(5); 

console.log(circle); 
console.log(circle.toString()); 
console.log(circle.Area); 

누구든지이 부분을 밝힐 수 있습니까?

Answer 1

당신이 원의 면적을 얻을 수 지역을 함수를 호출하는 경우 다음 당신은 당신의 로그 undefined을 보여이

console.log(circle.Area()) 

JS Fiddle

Answer 2

없음과 같이 호출 할 필요가있다.

개발자 콘솔에서 테스트하는 경우 입력이 끝날 때 최종 반환 값을 찾을 수 있습니다. 이 값은 종종 undefined이며 코드와는 아무런 관련이 없습니다.

Answer 3

코드를 실행, 나는 다음과 같은 출력을 얻을 :

Circle { Radius=5, Name="Circle", Edges=1 } 
Shape: Circle 
function() 

그래서, 여기에는 undefined이 없습니다. 그러나 계산 된 영역이 function() 대신 콘솔에 인쇄 된 것을보고 싶다고 생각할 수 있습니다.

console.log(circle.Area()); 

이 수정을 한 후 (JSFiddle 참조), 올바른 결과를 얻을 :

78.53981633974483 

설명 :

이

실제로 같은의 Area 함수를 호출하여 수행 할 수 있습니다에서 귀하의 구현, 당신은 단지 function(), 실제로는 원하는 값을 계산하는 함수를 호출 대신 인쇄 기능 개체에 액세스했다.

편집 귀하의 코멘트에서 같이

, 나는 귀하의 질문에 this one의 중복 믿습니다. this answer에 주어진 세부 사항에서, 나는 다음과 같은 작업 얻을 수있었습니다 :

function Circle(radius) { 
    this.Name = "Circle"; 
    this.Edges = 1; 
    this.Radius = radius; 
} 

Circle.prototype = Object.create(Shape.prototype); 
Circle.prototype.constructor = Circle; 

Circle.prototype.Area = function() { 
    return Math.PI * Math.pow(this.Radius, 2); 
}; 

그러나, 내 JS 능력이 제한됩니다, 그래서 이것은 결함 또는 두 가지가있을 수 있습니다. 고급 상속의 경우, 위에서 언급 한 질문에서 허용되는 답변을 사용하여 가치있는 프레임 워크에 대한 힌트를 얻을 수 있습니다.

Answer 4

나는 그것을 알아 냈다.

하지만이 스레드의 모든 사용자에게 감사드립니다. 새벽이오고 내 신기한 실수가 오래 걸립니다.

기본 원형 프로토 타입을 상속 한 전에 객체 원형에 대한 프로토 타입 함수 영역을 으로 지정했습니다.http://www.zipcon.net/~swhite/docs/computers/languages/object_oriented_JS/inheritance.html

에서

function Circle(radius) { 
    this.Radius = radius; 
} 


Circle.prototype = new Shape("Circle", 1); 
Circle.prototype.constructor = Circle; 

Circle.prototype.Area = function() { 
    return Math.PI * Math.pow(this.Radius, 2); 
}; 

Answer 5

//creating the main Object variables with static Propertys 
var MySystem={ 
    Utility:{}, 
    AppDbSystem:{ 
     connecterObj:"", 
     objCollection:new Array(), 
     sendObjCollection:null, 
     phpGridCollection:null 
    }, 
    OutManager:{}, 
    DbIndex:{}, 
    GoDb:{}, 
    Ioform:{}, 
    ListView:{}, 
    WindowSystem:{}, 
    AngularSystem:{ 
     objCollection:null 
    } 
} 

//the parent class (top of the chain) 
MySystem.GoDb.GoDb=function(){ 
    var that=this; 
    this.namespace; 
    this.speicher; 

    this.initGoDb=function(table,group,indexArr,readOnly){ 
     that.speicher=table; 
    } 

    this.showS=function(){ 
     alert(that.speicher); 
    } 

    this.setNamespace=function(ns){ 
     that.namespace=ns; 
    } 
    this.getNamespace=function(){ 
     return that.namespace; 
    } 
} 

//ListView second Class of the Chain 
MySystem.ListView.ListView=function(){ 
    var that=this; 
    MySystem.GoDb.GoDb.apply(this); //IMPORTANT to make it as an Instance 

    this.initListView=function(submitIndex,idArr,methodActionArr){ 
     that.initGoDb(submitIndex); 
    } 
} 
MySystem.ListView.ListView.prototype=new MySystem.GoDb.GoDb(); 

//The Child Class 
MySystem.ListView.ListStandard=function(){ 
    var that=this; 
    MySystem.ListView.ListView.apply(this); 


    this.init=function(elementYArr,attrs,methodActionArr,idArr,tableId,styleArr,styleArrTr,styleArrTd,withNumbers,submitIndex){ 
     that.initListView(elementYArr); 
    } 
} 
MySystem.ListView.ListStandard.prototype=new MySystem.ListView.ListView(); 

//now use it 
var test=new MySystem.ListView.ListStandard(); 
var test2=new MySystem.ListView.ListStandard(); 
test.init("eazy"); 
test.showS(); 
test2.init("second obj"); 
test2.showS(); 
test.showS(); 

모양과 적용 호출을하는 것을 잊지 말아 :

문제의 섹션과 같이 지금이다.

MySystem.ListView.ListView.apply(this); 

그렇지 않으면 개체 propertys는 정적이며 상속되지 않습니다.