Javascript에서 상속 함수 호출

Question

어떻게 든 JS 상속은 내 머리 속에 들어 가지 않습니다. 나는 지금 굉장히 많은 것들을 시도했고 어떤 이유로 나는 상속받은 객체에 메소드를 추가 할 수 없다.

내 생각에 B.setC을 정의한 다음 나중에 사용할 수 없습니다. 어떤 힌트?

환호 톰

A = function(value){ 
     this.aValue = value; 
} 


B = function(value){ 
    A.call(this, value); 
    this.bValue=value+value; 
} 

B.prototype = Object.create(A.prototype);//subclass extends superclass 


B.setC = function(value){ 
    this.c = value+value+value; 
    console.log("execution"); 
} 

B.prototype.setD = function(value){ 
    this.D = value+value+value+value; 
    console.log("execution"); 
} 





x = new B("ConstructorParam"); 
x.setC("methodParam");// gives that setC is not a function 
x.setD("methodParam");// works but I added setD to A not B 

Answer 1

혼란이 오해에서 온 것 같다; 귀하의 코멘트를 인용 :

사실 그것은 오타가 아닙니다. setC를 B에 추가하고 싶습니다. 내 이해가 옳았고 Chrome에서 디버깅을 보았 더라면 B.prototype.setB를 사용하면 setB를 B 일명 A가 아니라 B가 아닌 프로토 타입에 추가합니다. 아니면 내가 sth을 놓치고 있습니까? 또한 문제의이 주석으로 표시됩니다

:

x.setD("methodParam");// works but I added setD to A not B 

B.prototype는 A 없습니다. B.prototype은 A.prototype을 프로토 타입으로 사용하는 개체입니다. setD을 B.prototype에 올바르게 추가했습니다. A 또는 A.prototype에 어떤 식 으로든 추가되지 않습니다.

당신이 setC 및 setD 당신이 보여준 방법을 사용하려는 경우, 당신은 넣어 것 중 하나에 B.prototype (그래서 그들은 B의 인스턴스에 액세스 할 수 있습니다) (그래서 그들은 A 또는 B의 인스턴스에 접근 할 수있어) 또는 A.prototype에 . 그냥 후

var A = function(value){ 
    this.aValue = value; 
}; 

var B = function(value){ 
    A.call(this, value); 
    this.bValue = value + value; 
}; 

B.prototype = Object.create(A.prototype);//subclass extends superclass 

B.setC = function(value){ 
    this.c = value + value + value; 
    console.log("execution"); 
}; 

B.prototype.setD = function(value){ 
    this.d = value + value + value + value; 
    console.log("execution"); 
}; 

var x = new B("b"); 
x.setC("c"); 
x.setD("d"); 

: 우리가 B.prototype.setC =-B.setC =가 일부 누락 된 var의 추가, c 일치, 생성 및 메소드를 호출 할 때 짧은 값을 사용 d 소문자을 변경하는 경우

, 우리는이를 얻을 수 위의

 
     +−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−+ 
     |                | 
     \ +−−−−−−−−−−−−−−−+            | 
A−−−−−−−−−>| function |            | 
      +−−−−−−−−−−−−−−−+        +−−−−−−−−−−−−−+ | 
      | prototype  |−−−−−−−−−−−−−−−−−−−−−−−−−−−−>| object | |  
      +−−−−−−−−−−−−−−−+       /+−−−−−−−−−−−−−+ |  
                 | | constructor |−+ 
                 | +−−−−−−−−−−−−−+ 
     +−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−+ | 
     |           | | 
     \ +−−−−−−−−−−−−−−−+       | | 
B−−−−−−−−−>| function |       | | 
      +−−−−−−−−−−−−−−−+ +−−−−−−−−−−−−−−−−−−+ | | 
      | prototype  |−−−>|  object  | | | 
      +−−−−−−−−−−−−−−−+/+−−−−−−−−−−−−−−−−−−+ | | 
           | | constructor  |−+ | 
           | | setC: (function) | | 
           | | setD: (function) | | 
           | | [[Prototype]] |−−−+ 
      +−−−−−−−−−−−−−−−+ | +−−−−−−−−−−−−−−−−−−+ 
x−−−−−−−−−>| object  | | 
      +−−−−−−−−−−−−−−−+ | 
      | aValue: "a" | | 
      | bValue: "aa" | | 
      | c: "ccc"  | | 
      | d: "dddd"  | | 
      | [[Prototype]] |−−+ 
      +−−−−−−−−−−−−−−−+ 

[[Prototype]]

는 스펙이 일을 위해 사용하는 이름입니다 코드의 마지막 줄은, 이것은 우리가 (불필요한 세부 사항을 뺀 무리) 메모리에있는 것입니다 e 프로토 타입 객체에 대한 참조를 포함하는 객체의 "내부 슬롯". 반대로 함수의 속성 (예 : A.prototype) 인 prototype은 new과 함께 해당 함수를 사용하는 경우 new이 새 개체의 [[Prototype]]으로 사용할 개체를 가리키는 함수의 일반적인 속성 일뿐입니다.

---

그냥 ES2015 +에 여기 완전성에 대해 : 그것은 단지 오타, 당신은`B.prototype.setC = ...`의미하는 것

class A { 
    constructor(value) { 
     this.aValue = value; 
    } 
} 

class B extends A { 
    constructor(value) { 
     super(value); 
     this.bValue = value + value; 
    } 

    setC(value) { 
     this.c = value + value + value; 
     console.log("execution"); 
    } 

    setD(value) { 
     this.d = value + value + value + value; 
     console.log("execution"); 
    } 
} 

let x = new B("b"); 
x.setC("c"); 
x.setD("d");