[추상화] 07. return과 console.log의 차이

function printSquare(x){
 console.log(x * x);
}

function getSquare(x){
	return x * x;
}

printSquare(3)
console.log(getSquare(3))
console.log(printSquare(3))

printSquare 함수는 파라미터 x의 제곱을 콘솔에 출력하는 함수이고 getSquare 함수는 파라미터 x를 제곱해서 리턴해주는 함수 입니다.

 

함수들을 각각 호출해보면 printSquare 함수에 숫자 값 3을 전달해줬으므로 파라미터 x에는 숫자 값 3을 전달받게 되고 그러면 x * x 그러니까 3 * 3이 되고 결과적으로 console.log(9)가 실행이 되면서 콘솔에는 9가 출력이 됩니다.

 

getSquare 함수에 숫자 값 3을 전달하면 이번에도 파라미터로 숫자 값 3이 전달됐으니까 리턴 x * x가 리턴 3 * 3이 돼서 함수 호출 부분이 9로 대체가 됩니다.

 

리턴문이 실행됐으니까 자연히 getSquare 함수는 종료가 됩니다. 그런데 생각해보면 함수 호출 부분이 9로 대체되기만 했지 그 다음 동작에 대해서는 전혀 작성된 코드가 없습니다. 그러면 결국 프로그램은 이대로 종료가 되는데요. 저장하고 실행해보면 아무것도 출력이 되지않는 것을 확인할 수 있습니다.

 

getSquare함수에 console.log를 감싸주면 getSquare(3)은 9 이므로 console.log(9)와 같은 의미입니다. 저장하고 실행하면 9가 출력되는 것을 확인할 수 있습니다.

 

console.log(printSquare(3))는 return 값이 으므로 함수 호출 부분은 undefined 값을 리턴 받게 됩니다.

저장하고 실행하면 9와 undefined 값이 출력되는 것을 확인할 수 있습니다.

여기서 9는 2번 줄에서 console.log(3*3)의 결과이고 undefined는 console.log(printSquare(3))의 return값을 출력한 결과값입니다. 함수를 선언할 때 리턴문을 따로 작성하지 않으면 undefined 값을 리턴합니다.

 

정리하면, 리턴은 함수를 실행하고 어떤 값을 돌려주는 것이고 console.log는 어떤 것을 출력해 주는 함수입니다.