JavaScript에서 return 문은 선택 사항(optional)입니다. 즉, 함수가 반드시 값을 반환할 필요는 없습니다. 하지만 값을 반환하고 싶다면, return 문은 함수 내부의 마지막 위치에 작성해야 합니다.
return 문의 역할
예를 들어, 두 개의 숫자를 함수에 전달한 뒤 해당 함수가 두 수의 곱셈 결과를 호출한 프로그램(caller)에 반환하도록 만들 수 있습니다. 이처럼 return 문은 함수 내부에서 계산된 결과를 외부로 전달하는 핵심 역할을 담당합니다.
또한 return 문이 실행되면 함수의 실행이 즉시 종료되기 때문에, 이후에 작성된 코드는 더 이상 실행되지 않는다는 점도 함께 기억해 두면 좋습니다.
예제
아래 예제를 직접 실행해 보세요. 이 예제는 두 개의 매개변수를 받아 문자열을 연결(concatenate)한 후, 그 결과값을 호출한 프로그램으로 반환하는 함수를 정의합니다.
<html>
<head>
<script type = "text/javascript">
function concatenate(first, last){
var full;
full = first + last;
return full;
}
function secondFunction(){
var result;
result = concatenate('John', 'Doe');
document.write (result );
}
</script>
</head>
<body>
<p>Click the following button to call the function</p>
<form>
<input type = "button" onclick = "secondFunction()" value = "Call Function">
</form>
<p>Use different parameters inside the function and then try...</p>
</body>
</html>
코드 설명
위 예제에서 concatenate(first, last) 함수는 이름과 성을 매개변수로 받아 하나의 문자열로 연결한 뒤, return full;을 통해 결과값을 반환합니다. 이후 secondFunction()은 반환된 값인 'JohnDoe'를 변수 result에 저장하고 화면에 출력합니다.
버튼을 클릭하면 secondFunction()이 호출되어 최종 결과가 화면에 표시됩니다. 함수 내부에 다른 매개변수를 넣어 테스트해 보면서 return 문의 동작 방식을 익혀 보세요.