Chapter 4 - Item 39. 슈퍼클래스 속성 이름을 재사용하지 마라

 

상속받은 클래스에서 부모와 동일한 속성 이름을 다시 정의하면
예기치 못한 버그나 유지보수 어려움이 생긴다.

프로토타입 체인과 인스턴스 속성의 동작 방식 때문에, 의도와 다르게 덮어쓰기가 발생한다.

 

function Animal(name) {
  this.name = name;
}

function Dog(name, breed) {
  Animal.call(this, name);
  this.name = breed; // 부모의 name 필드를 덮어씀 (버그 가능성)
}

const d = new Dog("Max", "Beagle");
console.log(d.name); // Beagle — 원래 동물 이름 정보는 사라짐

같은 속성 이름을 쓰면 인스턴스의 필드가 부모 초기화 값을 그대로 덮어버린다.

 

 

ES6의 클래스 문법에서도 동일한 문제가 발생한다.

class Animal {
  constructor(name) {
    this.name = name;
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name);
    this.name = breed; // 부모에서 설정한 값 무효화
  }
}

const d = new Dog("Max", "Beagle");
console.log(d.name); // "Beagle"

위 코드에선 super(name)에서 초기화한 부모의 값을 바로 아래 줄에서 덮었다. 

이렇게 되면 부모 생성자가 내부적으로 이 필드를 사용하는 경우, 더 큰 버그로 이어질 수 있다.

 

 

! 권장사항

 

• 부모 클래스의 속성 이름을 그대로 쓰지 말고, 의미 있는 새로운 이름을 사용하자.
• 같은 개념이라도, 역할이 다르면 이름을 바꿔 충돌을 피한다.