[Today I Learn] - 오버로딩과 오버라이딩

치맨·2023년 8월 3일

[Today I Learn] - CS

목록 보기

11/13

오버로딩

오버로딩이란

같은 이름의 생성자 또는 메소드를 여러 개 선언하는 것을 말합니다.
주로 메소드를 확장하는데 사용하며, 아래의 조건을 만족해야 합니다.
- 조건 1 : 메소드의 이름이 일치해야 합니다.
- 조건 2 : 메소드 매개변수의 개수 또는 타입이 달라야 합니다. (만약 개수가 같다면 타입을 다르게, 타입이 같다면 개수를 다르게)

오버로딩을 왜 사용할까요?

첫 번째로는 같은 기능을 하는 메서드를 하나의 이름으로 사용할 수 있기 때문입니다.
두 번째로는 메서드의 이름을 절약할 수 있기 때문입니다. (이름짓는거 정말 힘들죠 ㅠㅠ)

string, number 2가지의 타입을 받아 더하는 기능을 하는 add함수를 예로 들어 보겠습니다.

숫자끼리의 합(숫자 + 숫자)을 구현하는 함수
문자열끼리의 합(문자열+문자열) 2개의 함수

오버로딩을 사용하지 않은 경우 아래와 같이 2개의 값을 더해주는 같은 기능을 하는 함수이지만, 타입이 다르기 때문에 2개의 함수로 구분해줘야 했습니다.

// 숫자끼리의 합 
const addNumber = (value1: number, value2: number) => {
    return value1 + value2;
  };

  // 문자열끼리의 합
  const addString = (value1: string, value2: string) => {
    return value1 + value2;
  };

  console.log(addNumber(2, 2)); // 4
  console.log(addString("2", "2")); // 22

오버로딩을 사용한 경우 아래와 같이 같은 함수의 이름으로 string,number타입의 값을 더하는 기능을 나타낼 수 있습니다.

  function add(value1: string, value2: string): string; 
  function add(value1: number, value2: number): number; 
  
  function add(value1: any, value2: any): any {
    return value1+value2;
}
  

  console.log(add(2, 2)); // 4
  console.log(add("2", "2")); // 22

오버로딩을 통해 같은 add()라는 하나의 함수로 숫자형 타입의 덧셈과, 문자형 타입의 덧셈을 나타낼 수 있습니다. 따라서 오버로딩은 확장하는데 주로 사용합니다.

오버로딩 사용방법

오버로딩 시그니처를 작성한다.
오버로딩 구현부를 작성한다.
사용한다.

위의 코드를 다시 참고해보겠습니다.

  
  // 1. 오버로딩 시그니처를 작성합니다. 
  function add(value1: string, value2: string): string; 
  function add(value1: number, value2: number): number; 
  
  // 2. 오버로딩 구현부를 작성합니다.
  function add(value1: any, value2: any): any {
    return value1+value2;
}
  
  // 3. 사용합니다. 
  console.log(add(2, 2)); // 4
  console.log(add("2", "2")); // 22

오버라이딩

오버라이딩이란

오버라이딩이란 부모 클래스로부터 상속받은 메서드를 자식 클래스에서 재정의하는 행위를 의미합니다.
주로 메서드를 재정의 하는데 사용하며 아래의 조건을 만족해야합니다.

오버라이딩하려는 메서드의 이름, 매개변수, 리턴값이 모두 동일해야 합니다.

재정의하려는 부모 클래스의 메서드보다 좁은 접근범위를 가질 수 없습니다.

반환타입은 부모클래스의 하위타입이라면 변경 가능하다.

왜 오버라이딩을 사용할까요?

오버라이딩을 통해 같은 함수의 이름으로 다른 기능을 구현하는 즉 코드의 재사용성을 높이고 유지보수를 용이하게 할 수 있기 때문입니다.
부모 클래스에서 공통적으로 사용되는 기능을 정의하고, 자식 클래스에서 이를 필요에 맞게 재정의하여 사용할 수 있습니다.
바로 예시로 확인해보겠습니다.

class Animal {
  speak(): void {
    console.log("The animal makes a sound");
  }
}

class Dog extends Animal {
  speak(): void {
    console.log("월! 월!");
  }
}

class Cat extends Animal {
  speak(): void {
    console.log("야옹~");
  }
}

class People extends Animal {
  speak(): void {
    console.log("이노무시키야!");
  }
}

let dog: Dog = new Dog();
dog.speak();  // 출력: "월! 월!"

let cat: Cat = new Cat();
cat.speak();  // 출력: "야옹~"

let people: People = new People();
people.speak();  // 출력: "이노무시키야!"