/JavaScript/함수(매개변수, 인자, return)(3)

return

함수의 출력에 해당하는 return

return은 어떤 형태로 사용되고 어떤 효과를 주는지 알아보았다.

<script>
  function sum(left, right){
     document.write(left+right+'<br>');
  }
  sum(2,3);
  sumColor(2,3);
  sum(3,4);
</script>

먼저 매개변수와 인자를 사용하여 만들어놓은 코드를 응용하여

여러 가지 방법 중에 텍스트 색상을 바꾸는 결과를 주는 코드를 입력해보았다.

 

function sum(left, right){
  document.write(left+right+'<br>');
}
function sumColor(left, right){
  document.write('<div style="color:blue">'+(left+right)+'</div><br>');
}
sum(2,3);
sumColor(2,3);
sum(3,4);

또 다른 결과를 출력하게 될 코드를 입력하려면 새로운 함수를 만들어 지정해 주어야 한다.

하지만 예제처럼 연산을 많은 곳에서 사용한다면

매우 많은 함수를 만들어야 한다.

 

이러한 상황에 사용되는 것이 return이다.

function sum2(left, right) {
    return left+right;
}
document.write(sum2(2,3)+'<br>');
document.write('<div style="color:red">'+sum2(2,3)+'</div>');
document.write('<div style="font-size:30px;">'+sum2(2,3)+'</div>');

 

return을 사용하면 전처럼 매번 다른 함수의 매개변수를 통해

실행하는 것이 아니라 매개변수를 통해 나온 값을 return을 통해

전달해 주고 그 값을 다양한 용도로 함수를 활용할 수 있다는 걸 알 수 있다.