책에서는 출력결과가 16G 16G 인데, 실제 돌려보면
kimwonyong opened this issue · 3 comments
안녕하세요.
책을 읽다보면서, 해당 코드를 실행했는데,
0G 16G 로 나오네요.
부모 클래스의 set 프로퍼티로 값을 설정하면, 부모의 멤버변수만 바뀌고, 자식의 멤버변수는 안 바뀌는건가요 ?
안녕하세요?
책 예제는 다음과 같습니다.
class PC {
constructor(hddCapacity) {
this.hddCapacity = hddCapacity;
this.ram = "0G";
}
set ramCapacity(value) { this.ram = value; } // set 프로퍼티
get ramCapacity() { return this.ram; } // get 프로퍼티
getHddCapacity() {
return this.hddCapacity;
}
}
class Desktop extends PC {
constructor(hddCapacity) {
// 부모 클래스의 생성자를 호출함
super(hddCapacity);
this.hddCapacity = hddCapacity;
}
getInfo() {
console.log("1번 HDD 용량 : " + super.getHddCapacity(), super.hddCapacity);
console.log("2번 HDD 용량 : " + this.getHddCapacity(), this.hddCapacity);
this.hddCapacity = "2000G";
console.log("3번 HDD 용량 : " + super.getHddCapacity(), super.hddCapacity);
console.log("4번 HDD 용량 : " + this.getHddCapacity(), this.hddCapacity);
super.ramCapacity = "16G"; // 부모 클래스의 set 프로퍼티로 값을 설정함
console.log("5번 RAM 용량 : " + this.ramCapacity, super.ramCapacity);
this.ramCapacity = "8G"; // 상속 받은 set 프로퍼티로 값을 설정함
console.log("6번 RAM 용량 : " + this.ramCapacity, super.ramCapacity);
}
}
let myDesktop = new Desktop("1000G");
myDesktop.getInfo();
https://github.com/happygrammer/typescript/blob/master/ch7/class/src/class/modifier/super-this.ts
실행결과(2.7.2, 3.0.3 버전의 결과)
1번 HDD 용량 : 1000G undefined
2번 HDD 용량 : 1000G 1000G
3번 HDD 용량 : 2000G undefined
4번 HDD 용량 : 2000G 2000G
5번 RAM 용량 : 16G 16G
6번 RAM 용량 : 8G 8G
실행 결과에 오류가 있지 않습니다. 다만 책에서는 상세 내용을 다루지 않았는데요. 결론적으로 말씀드리면 부모 클래스의 인스턴스 멤버에 set 프로퍼티 값을 설정하면 자식의 멤버변수에도 영향을 미칩니다.
super 키워드로 set 프로퍼티 값을 할당습니다.
super.ramCapacity = "16G";
그리고 출력해 보겠습니다.
console.log("5번 RAM 용량 : " + this.ramCapacity, super.ramCapacity);
그러면 ramCapacity 프로퍼티는 모두 "16G"로 출력됩니다. 왜냐하면 this는 인스턴스의 전역 스코프에 선언된 ramCapacity을 참조하기 때문입니다. 예제에 다음 코드가 있습니다.
this.ramCapacity = "8G";
클래스 내부에 선언된 this의 경우 클래스 인스턴스의 전역을 가르킵니다. (자바스크립트에서느 this는 스코프가 없다면 전역 스코프의 window 객체를 가르킵니다. ) 따라서 자식 클래스에서 this.ramCapacity = "8G";와 같이 값을 할당하면 클래스 인스턴스 전역에 선언된 ramCapacity에 할당됩니다. 따라서 super.ramCapacity든 this.ramCapacity든 동일한 ramCapcity 프로퍼티를 참조하고 있어 값이 같습니다.
this는 다른 언어와 다소 다르게 동작하는데요 this와 관련한 추가적인 설명은 다음 페이지를 참조해 주시기 바랍니다. [1] [2]
답변 달아주셔서 감사합니다!
위에 작성해주신 코드와, 링크에 있는 코드(https://github.com/happygrammer/typescript/blob/master/ch7/class/src/class/modifier/super-this.ts)
둘다 작성해서 돌려봤는데, (2.7.2, 3.0.1)
저는 여전히
5번 RAM 용량 : 0G 16G 로 나오네요. ㅠㅠ
우선 답변주신 '부모 클래스의 인스턴스 멤버에 set 프로퍼티 값을 설정하면 자식의 멤버변수에도 영향을 미칩니다.' 라고 생각하고, 다음 쳅터 계속 공부하겠습니다.
감사합니다!
컴파일 결과를 확인해 보고싶은데요. 컴파일된 js파일 있으면 공유 가능하실까요? 감사합니다.