04 Function에서 Return의 의미

 

 

Return

 

 

 

function에서 사실상 가장 중요한 개념을 이제 알아야 한다.

이전까지 결괏값을 보고 확인하기 위해 console을 활용했다.

브라우저에서 콘솔 화면에 값을 띄워주는 함수가 console.log();라는 것이 있기 때문이었다.

하지만 실제로 function을 사용할 때는 콘솔에서 확인하기 위해 만들지는 않기 때문에

실제 코드에서는 그 결과값을 어떻게 가져오는 지를 알아야겠다.

 

 

 

1. Function에서 Return의 의미

 

 

이전처럼 콘솔로 결과를 확인하는 함수를 잠시 살펴보자

 

const a = 10;

function plus(kAge){

    console.log( kAge + 2);

}

plus(a);

 

이처럼 함수 plus 라는 것은  a 값을 kAge에 대입해서 +2  더하기를 실행한다라고 정의하고 있다.

실행한다는 표현보다는 "결과값을 콘솔에 출력해라"라는 것이 맞을 것이다.

그럼 plus 함수 안에 있는 console.log();라는 것을 이제 밖으로 끄집어내야겠다.

함수 안에는 딱 계산식만 존재해야 하는 것이 앞으로 우리의 목적에 부합하는 것일 테니까.

 

const a = 10;

function plus(kAge){

   kAge + 2;

}

console.log(plus(a));

 

console.log(); 를 밖으로 끄집어내고, 이제 plus 함수 안에는 딱 계산식만 들어있다.

그리고 밖에서 plus 함수에 a를 대입해서 결괏값을 콘솔에 출력하라고 했다.

그랬더니?

> undefined

 

이게 자바스크립트에서 무언가 누락된 결과이다.

이제 설명하려는 return이라는 것!

그러니까 저 함수 안에서 계산된 무언가를 함수 밖에서 쓰이도록 해주는 명령어가 있는 것이다.

필히 return이라는 것을 넣어줘야 사용이 가능해진다.

 

const a = 10;

function plus(kAge){

   return kAge + 2;

}

console.log(plus(a));

콘솔에서 출력해서 확인용도로는 적당해졌다.

실제로 코드에서 저 결과값을 가져다 사용하려면 그 plus(a);라는 것의 결과를 어딘가 메모리에 저장해야 할 것이다.

 

const a = 10;

function plus(kAge){

   return kAge + 2;

}

let myAge = plus(a);

console.log(myAge);

 

이렇게 myAge라는 것에 let 타입을 사용해서 변수를 할당해 주는 것으로 코드에 활용이 가능해졌다.

마지막의 console.log();는 정말 myAge에 값이 들어있는지 확인용도로 넣은 것이다.

실제로는 더 이상 콘솔에서 별도로 확인할 필요는 없을 것이다. 그저 다른 곳에서 저 myAge라는 값을 가져다 사용하도록 만들어진 것이다.

 

 

 

 

정리해보면

① 함수 안에 있던 console.log(); 를 삭제해서, 값만 도출되도록 함 (return 추가)

② 그 결괏값을 myAge라는 곳에 할당함. (a값에 따라 변하는 값이므로 let을 사용했음)

③ 그 myAge 값을 콘솔에 출력하라고 함.

 

 

이제 원하는 결과를 확인해볼 수 있다. 물론 아직까지도 콘솔을 통해서 그 결과를 확인하고 있지만

앞으로는 웹 페이지를 통해서 확인하게 될 것이다.

 

 

---

 

 

배운 것을 응용해서 계산기를 만들어보자

const calculator = {

    plus: function (a,b){

        return a + b;

    },

    minus: function (a,b){

        return a - b;

    },

    times: function (a,b){

        return a * b;

    },

    divide: function (a,b){

        return a / b;

    },

    power : function (a,b){

        return a ** b;

    }

}

const plusResult = calculator.plus(2,3);

console.log(plusResult);

 

calculator라는 오브젝트에 plus함수, minus함수, 등등이 포함되어 있으니, 

필요한 함수를 불러다 사용할 수 있다.

calculator.plus(a , b);라는 식으로 사용하는 것이다.

 

 

 

 

 

BR. h