JavaScript/Vanilla JS

함수의 매개변수와 리턴값 , 가변인자 함수

유혁스쿨 2022. 1. 17. 13:56
728x90
반응형

매개변수와 리턴값 

매개변수와 리턴값을 갖는 함수는 다음과 같이 정의한다.

function 함수이름 (매개변수1, 매개변수2, 매개변수3, ...) {
	return 리턴값;
}

 

함수를 호출할 때 (소괄호)안에 값이나 변수등의 인자값을 주입하는것을 매개변수라고 한다.

함수를 선언할 때 사용할 매개변수를 ,쉼표와 함께 (소괄호) 안에 지정해준다.

어떤식으로 활용하는지 다음과같이 구현해본다.

function f(x) {
    return x * x ;
}

alert(f(3));

 호출되는 f(x) 함수의 매개변수는 x이고 return 내용은 인자값으로 받은 매개변수를 서로 곱하는 식이다.

따라서 매개변수 x에 정수값 3을 담아 호출한다면 3*3 = 9의 값을 반환한다.

 

함수를 호출하는 쪽과 정의된 함수를 연결하는 매개가 되는 변수이므로 매개변수라는 이름을 사용한것이다.

 

 

 

 

 

매개변수와 가변인자

자바스크립트는 함수를 생성할 때에 지정한 매개변수의 개수보다 많거나 적은 매개변수를 사용하는것을 허용한다.

 

alert('매개변수1','매개변수2');

원래 함수에서 선언된 매개변수보다 많게 사용하면 일반적으로 추가된 매개변수는 무시한다.

prompt('매개변수1');

또한 원래 함수에서 선언한 매개변수보다 적게 사용하면 지정하지 않는 매개변수는 undefined로 입력된다.

(크롬에서는 아무것도 출력하지 않음)

 

하나의 함수이지만 매개변수를 어떠한 방식으로 입력하냐에 따라서 서로 다른결과를 리턴하는 것이다.

자바스크립트에서는 오버로딩을 허용하지 않는다. 따라서 여타 프로그래밍 언어(예를들어 자바) 에서 사용되는 오버로딩 문법은 아니다.

 

가변 인자 함수

가변 인자 함수는 매개변수의 개수가 변할 수 있는 함수이다.

자바스크립트는 매개변수의 개수를 정의된 것과 다르게 사용해도 괜찮지만, 여기서 말하는 가변인자 함수는 매개변수를 선언된 형태와 다르게 입력했을 때, 매개변수를 모두 활용하는 함수를 뜻한다.

대표적으로 자바스크립트의 배열을 만드는 Array() 함수가 있다.

 

 

function sumAll() {
    alert(typeof arguments + ':' + arguments.length);
}
sumAll(1,2,3,4,5,6,7,8,9);

자바스크립트의 모든 함수는 기본 내부에 변수 arguments가 기본적으로 존재한다.

변수 arguments는 매개변수의 값들을 갖는 object 객체형태의 배열이다.

함수를 호출할 때 9개의 변수를 입력했으므로 arguments배열의 length 속성이 9로 나온다.

 

function sumAll() {
    var output = 0;
    for (var i = 0; i < arguments.length; i++) {
    	output += arguments[i];
    }
    return output;
}
alert(sumAll(1,2,3,4,5,6,7,8,9));

for 반복문을 사용하여 arguments의 길이만큼 반복하여 요소를 하나씩 누적하여 더하는 로직이다.

코드를 실행하면 1부터 9까지 9개의 매개변수를 모두 합한 값인 45를 출력한다.

 

 

 

 

function exArguments() {
    var length = arguments.length;
    if (length == 0) {//매개변수가 없을 때
        return;
    }else if (length == 1) {//매개변수가 1개일때
        return;
    }else if (length == 2) {//매개변수가 2개일때
        return;
    }else {//매개변수가 3개일때
        return;
    }
}

매개변수의 개수에 따라 서로 다른것을 리턴하는 함수는 위와 같이 arguments의 요소 개수에 따라 조건을 설정하여 구현할 수 있다.

 

리턴 값

함수의 return은 매개변수와 무조건 쌍으로 가는것만은 아니다.

var 함수1 = function () {
    alert('함수1');
}

function 함수2 () {
    alert('함수2');
}
함수1();
함수2();

위와같이 alert() 같은 내장함수를 띄우는 기능을 하는함수를 return문을 사용하여 동일하게 기능을 사용할 수 있다.

var 함수1 = function () {
    return alert('함수1');
}

function 함수2 () {
    return alert('함수2');
}

함수1();
함수2();

두 형태 모두 alert() 함수를 호출한다.

 

 

return 키워드는 함수가 실행되는 도중에 함수를 호출한 곳으로 돌아가라는 의미이다.

따라서 return키워드를 사용하면 값을 지정하지 않아도 함수를 호출한 곳으로 돌아간다.

function returnFunction() {
    alert('문장A');
    return;
    alert('문장B');
}
returnFunction();

return 키워드를 alert('문장B'); 이전에 사용했으므로 해당 위치에서 함수가 종료된다.

따라서 '문장A' 만 출력하는것을 확인할 수 있다.

 

 

var output = returnFunction();
alert(typeof output + ' : ' + output);

추가적으로 위 코드처럼 return값이 없는 함수를 출력하는 경우에는 undefined 자료형과 undefined값을 출력한다.

 

 

+번외

 

728x90
반응형