(12) JavaScript - 추상화 / return문의 함수 실행 중단

자료형에서 배웠던 함수에서 return 문은 어떤 값을 되돌려주는 output의 역할을 한다.

    function square(x) {
        return x * x
    }
    console.log(square(3));

 

위 코드를 보면 square 함수를 호출하면서 숫자 값 3을 파라미터로 전달하고 있다.

그러면 파라미터 x에 3이 전달되고 리턴 3 * 3이 되면서 함수 호출 부분은 9를 되돌려 받는다.

결국 최종 출력 결과는 9이다. 

 

이렇게 보면 생각보다 간단한데, 사실 리턴문에는 이렇게 결과값을 돌려주는 역할 뿐만아니라

하나의 역할이 더있다.

 

return문의 함수 실행 중단

말 그대로 함수 내부에서 리턴 키워드가 나오면 함수의 실행은 그 지점에서 중단이 된다.

    // 함수 실행 중단 하는 return문
    function square(x) {
        console.log('return 전');
        return x * x
        console.log('return 후');
    }
    console.log('함수 호출 전');
    console.log(square(3));
    console.log('함수 호출 후');

 

위에서 함수 안에 단순히 리턴문 하나만 있었다면 이제는 위아래로 다른 코드도 있다.

여기서 특이한 게 하나 발견되는데 저장하고 실행해 보면

 

'return 후' 코드만 실행이 되지 않은 걸 확인 할 수있다.

 

이유를 찾기위해 코드의 실행 순서를 살펴보자면..

    function square(x) {
        console.log('return 전');
        return x * x
        console.log('return 후');
    }

▲ 특별한 동작이 없는 함수 선언이다.

 

    console.log('함수 호출 전');
    console.log(square(3));
    console.log('함수 호출 후');

▲ 다음으로 '함수 호출 전' 이라는 문자열을 출력하게 되는데 그 다음 square함수를 호출하고 파라미터로 3을 전달해준다.

 

그러면 이제 함수 선언 부분에 코드가 실행이 되는데

함수 내부에서도 제일 윗줄부터 'return 전' 이라는 문자열이 출력된다.

 

그 다음 리턴 x * x 이므로 9가 리턴이되는데,

이렇게 리턴문을 통해서 함수 호출 부분에 어떤 값을 되돌려주고 나면

그대로 함수의 실행이 중단이 되어버리고 만다.

그러니까 이미 x * x 에서 3 * 3의 9가 리턴이 되었으니 = 값을 되돌려줬으니 

거기서 그냥 중단이 된 것

그렇기 때문에 '함수 호출 후' 라는 문자열을 9번 줄에서 출력을 하고 프로그램이 종료가 된다.

 

그러면 'return 후' 문자열은 어떻게 되는가 싶을 것이다.

square 함수를 어떤 식으로 호출 해도 리턴문으로 인해 함수가 종료됨에 따라서, 

리턴문 아래에있는 코드들은 절대로 실행될 일이 없다.

 

이러한 코드를 아무런 의미가 없다고해서 'Dead Code' 라고 부르며,

절대 실행 될 수없는 코드니까 작성하지 않는게 좋다.

 

즉 리턴은 함수 호출 부분에 어떤 값을 되돌려주는 것 뿐만 아니라

함수 자체의 실행을 중단한다는 것 

이런 리턴의 두 가지 역할이 있다는 것을 이해하자.