포스트

자바스크립트의 오버로딩

안녕하세요 🐸

저와 같이 자바로 개발을 시작했던 사람은 대게 오버로딩&오버라이딩이 익숙한 경우가 많습니다.

하지만 자바스크립트에서는 오버로딩, 오버라이딩이 없습니다

그런데, 지금까지 사용하면서 자바스크립트에서도 오버로딩이 된 것 같은 현상을 분명 많이 봤습니다.

이에 대해 간단하게 알아보고 정리합니다.

목차

  1. 요약
  2. 잘못된 오버로딩
  3. 오버로딩 예시

요약

  • 자바스크립트는 오버로딩 & 오버라이딩을 지원하지 않는다.
  • 분기를 통해 오버로딩을 구현한다

잘못된 오버로딩

다음과 같은 코드가 있을 때 결과적으로는 같은 이름으로 선언된 마지막 함수만이 남습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function exam(){
	console.log('파라미터를 받지 않는 함수')
}

function exam(val1){
	console.log('하나의 변수를 받는 오버로딩')
}

function exam(val1,val2){
	console.log('2개의 변수를 받는 오버로딩')
}

exam(); // '2개의 변수를 받는 오버로딩' 출력


오버로딩 예시

자바스크립트에서 오버로딩 처리를 위해서는 파라미터를 기준으로 분기처리 작업이 필요합니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function examV2(val1, val2, val3){
	if(val3){ // val3가 undefined 가 아닌 경우 => 인수가 3개 전달된 경우
		console.log(val1+val2+val3);
	} else if(val2){ // val2가 undefined 가 아닌 경우 => 인수가 2개 전달된 경우
		console.log(val1+val2);
	} else if(val1){ // val1이 undefined 가 아닌 경우 => 인수가 1개 전달된 경우
		console.log(val1);
	} else {
		console.log('hello');
	}
}

examV2(5,5,5); // 15 출력
examV2(10,10); // 20 출력
examV2(100); // 100 출력
examV2(); // hello 출력
이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.