본문 바로가기

Front/JavaScript

함수를 사용할 때 return을 제대로 활용하자

return이라는 개념 자체를 이해하는 데 상당히 오래 걸렸다.

구체적으로 코드부터 보고 가보자.

 

let something;
let anything;

function recordReturn(input) {
  
   something = input;
   if (something === undefined) {
       something = "something in here";
   }
   
   return something;
}

function emptyReturn() {
   
   anything = "do not return this.";
   return;
}

recordReturn();
emptyReturn();

 

recordReturn 함수를 호출한다면 그 자리에 무엇이 남을까?

something이 남는다.

이렇게 단순한 개념이지만 코드를 볼 때 쉽게 이해하기 어려웠다.

눈에 보이지 않고 단순히 상상만으로 있을 것이라고 알아채야 하기 때문이다.

실제로 코드를 실행하면 이런 결과가 나온다.

 

let something;
let anything;

function recordReturn(input) {~}
function emptyReturn() {~}

something;

 

보이는가?

recordReturn() 및 emptyReturn() 함수는 실행하고 사라졌다.

대신 그 자리에 return으로 넘겨주는 값만 남는다.

이 단순한 것을 잘 이해해야 한다.

 

구체적으로,

호출하는 곳이 있다면

응답은 반드시 호출하는 곳까지 온다는 것이다.

 

위 예시에서는 함수 하나였지만

함수가 중첩되고 중첩되서 엄청 복잡할 수도 있고,

다른 소프트웨어나 다른 서버에 요청을 할 경우에도 적용되는 법칙이다.

 

RETURN!

요청이 있다면 >> 응답이 있다!

 

이 외에도 함수에서는 빈 return을 함수 종료하는 용도로 쓰기도 한다.

다음 예시를 보자.

 

let start;
let end;

if (end === undefined) {
    start = "START";
}

function run(input) {
    
    if (input === "START") {
        end = "ENDING";
        return;
    }
    
    end = "NEVER COME HERE";
}

run(start);

 

run() 함수를 끝까지 실행하면 변수 end에는 "ENDING"이 아니라 "NEVER COME HERE" 값이 담기고 만다.

특정한 목적을 달성했으면 더 이상 함수를 진행시킬 필요가 없다면 그 즉시 return; 을 사용하여 함수를 벗어나는 것이다.

이 상황에서 return은 반환이라는 뜻이 아니라 탈출이라는 뜻으로 활용된다.