자바스크립트 return 문 작동 방식 완벽 정리: 함수에서 값을 반환하는 방법

return 문이란 무엇인가?

자바스크립트에서 return 문은 두 가지 핵심 역할을 수행합니다. 첫째, 함수의 실행을 즉시 중단하고, 둘째, 함수 내부의 값을 함수 외부로 반환(return)합니다.

간단한 예시를 통해 살펴보겠습니다. 이름을 입력받는 addName이라는 함수가 있다고 가정해 보겠습니다.

let addName = function(name) {}

함수 안에 갇힌 값의 문제점

이제 위 함수에 실제 이름을 인수로 전달해 보겠습니다.

let myNameIs = addName("David")

이 코드가 실행되면 addName 함수 내부에는 문자열 "David"를 담은 변수 name이 생성됩니다. 그런데 여기서 문제가 발생합니다. 이 name 변수와 그 값은 함수 밖에서 접근할 수 없습니다. 값이 addName() 함수라는 '닫힌 공간' 안에 갇혀 있기 때문입니다.

실제로 다음과 같이 출력해 보면:

console.log(myNameIs)
// undefined

undefined가 출력됩니다. 함수가 아무런 값도 반환하지 않았기 때문에, 변수 myNameIs에는 아무것도 저장되지 않은 것입니다.

return 문으로 값 반환하기

바로 이 지점에서 return 문이 필요합니다. 함수 내부에 return name을 추가한 뒤, 다시 한번 결과를 확인해 보겠습니다.

let addName = function(name) {
  return name
}

let myNameIs = addName("David")

console.log(myNameIs)
// "David"

이번에는 "David"가 정상적으로 출력됩니다! return name 구문이 함수 내부의 name 값을 함수 호출 지점, 즉 myNameIs 변수로 전달해 준 것입니다.

정리하며

return 문은 자바스크립트 함수의 핵심 요소입니다. 기억해야 할 핵심 포인트는 다음과 같습니다.

• return 문을 만나면 함수의 실행이 즉시 종료되며, 이후의 코드는 실행되지 않습니다.
• return 뒤에 오는 값이 함수 외부로 반환되어, 호출한 곳에서 변수에 저장하거나 활용할 수 있습니다.
• return 문이 없는 함수는 기본적으로 undefined를 반환합니다.

이 세 가지만 기억하면 함수에서 값을 주고받는 대부분의 상황을 명확하게 이해할 수 있습니다.