JavaScript 함수에서 값 반환하기
JavaScript 함수에서 값을 반환하려면 return 문을 사용해야 합니다. return 문은 함수의 실행 결과를 호출한 곳으로 돌려주는 역할을 하며, 이를 통해 계산된 결과를 변수에 저장하거나 다른 로직에 활용할 수 있습니다.
return 문이 실행되면 함수는 즉시 종료되고, 지정한 값이 함수 호출 위치로 전달됩니다. 아래 예제 코드를 직접 실행하면서 동작 방식을 확인해 보세요.
예제 코드
<html>
<head>
<script>
function concatenate(name, age) {
var val;
val = name + age;
return val;
}
function DisplayFunction() {
var result;
result = concatenate('John ', 20);
document.write(result);
}
</script>
</head>
<body>
<p>아래 버튼을 클릭하면 함수가 호출되어 결과가 화면에 표시됩니다.</p>
<form>
<input type="button" onclick="DisplayFunction()" value="결과 보기">
</form>
</body>
</html>코드 설명
concatenate() 함수는 이름(name)과 나이(age) 두 개의 매개변수를 받아 이를 하나의 문자열로 연결한 뒤, return val; 구문을 통해 그 결과값을 반환합니다.
DisplayFunction() 함수는 concatenate('John ', 20)을 호출하여 반환받은 값을 result 변수에 저장하고, document.write()로 화면에 출력합니다. 버튼을 클릭하면 "John 20"이라는 결과가 표시됩니다.
return 문 사용 시 주의사항
return 문이 실행되면 함수의 나머지 코드는 더 이상 실행되지 않으므로, 반환할 값은 함수 로직의 마지막 단계에서 지정하는 것이 일반적입니다. 또한 return 문을 명시하지 않으면 함수는 자동으로 undefined를 반환한다는 점도 기억해 두면 좋습니다.