자바스크립트 return에 대해서 더 공부해보자

한 주동안 들었던 수업을 복습하면서 이해가 되지 않았던 return에 대해 공부하는 시간을 가졌다. 

사실 공부를 했지만 100% 이해를 한게 아니라서 지금 적는 내용 중에도 미흡한 점이 있을 수도 있다. 

나중에 내가 이 포스팅을 보고서 수정할 사항이 있다면 수정해서 재 업로드 할 예정이다..! 미래의 헬리야 실력아 쑥쑥 올라라!!

 

---

 

return 이란

1. return은 말그대로 돌려준다는 의미. 내가 설정한 값을 결과값으로 돌려준다는 말입니다

2. return 뒤에오는 함수들은 즉시 종료가 됩니다. "dead code"

 

리턴값은 함수를 실행시킨 곳으로 돌려준다 

그리고 함수가 끝까지 실행되지 않고 리턴하는 지점에서 끝난다. 

 

예시1

 

 

1. hello라는 function을 실행하는데 number1, number2를 넣어봐. 그리고 그걸 helloReturnValue라고 하자.

number1이라는 변수를 10이라고 선언했네!
number2라는 변수를 20이라고 선언했네!

 

funtion hello의 a, b에 각 각 number1(10), number2(20)를 넣어봐!

알겠어! 즉 console.log a, b에 number1(10), number2(20) 넣을게! 그럼 10+20이니까 30!!!!

>이렇게 첫번째 줄 30이 콘솔창에 로그되었어요!

 

   2. hello라는 function을 실행하는데 number3, number4를 넣어봐. 

 

number3라는 변수를 30이라고 선언했네!
number4라는 변수를 40이라고 선언했네!

 

funtion hello의 a, b에 각 각 number3(30), number4(40)를 넣어봐!

알겠어! 즉 console.log a, b에 number3(30), number4(40) 넣을게! 그럼 30+40이니까 70!!!!

>이렇게 두번째 줄 70이 콘솔창에 로그되었어요!

 

   3. hello라는 function을 실행하는데 number1, number2를 넣어!

 

number1이라는 변수를 10이라고 선언했네!
number2라는 변수를 20이라고 선언했네!

 

funtion hello의 a, b에 각 각 number1(10), number2(20)를 넣어봐!

알겠어! 즉 console.log a, b에 number1(10), number2(20) 넣을게! 그럼 10+20이니까 30!!!!

>이렇게 세번째 줄 30이 콘솔창에 로그되었어요!

 

  4.  3번에서 했던 걸 콘솔 창에 보여줘!

못해! 

>이렇게 네번째 줄에 undefined가 콘솔창에 로그되었어요!

 

 

 

예시2

 

1. hello라는 function을 실행하는데 number1, number2를 넣어봐. 그리고 그걸 helloReturnValue라고 하자.

number1이라는 변수를 10이라고 선언했네!
number2라는 변수를 20이라고 선언했네!

 

funtion hello의 a, b에 각 각 number1(10), number2(20)를 넣어봐!

알겠어! 즉 console.log a, b에 number1(10), number2(20) 넣을게! 그럼 10+20이니까 30!!!!

>이렇게 첫번째 줄 30이 콘솔창에 로그되었어요!

 

   2. hello라는 function을 실행하는데 number3, number4를 넣어봐. 

 

number3라는 변수를 30이라고 선언했네!
number4라는 변수를 40이라고 선언했네!

 

funtion hello의 a, b에 각 각 number3(30), number4(40)를 넣어봐!

알겠어! 즉 console.log a, b에 number3(30), number4(40) 넣을게! 그럼 30+40이니까 70!!!!

>이렇게 두번째 줄 70이 콘솔창에 로그되었어요!

 

   3. hello라는 function을 실행하는데 number1, number2를 넣어!

 

number1이라는 변수를 10이라고 선언했네!
number2라는 변수를 20이라고 선언했네!

 

funtion hello의 a, b에 각 각 number1(10), number2(20)를 넣어봐!

알겠어! 즉 console.log a, b에 number1(10), number2(20) 넣을게! 그럼 10+20이니까 30!!!!

>이렇게 세번째 줄 30이 콘솔창에 로그되었어요!

 

  4.  3번에서 했던 걸 콘솔 창에 보여줘!

return이 저장을 하고 외부와 연결을 해주니까 console.log로 토스 가능해요! 그래서 30이 출력돼요!

>이렇게 네번째 줄에 30가 콘솔창에 로그되었어요!

 

 

예시3

 

(이번에는 친절하게 색 별로 어디서 출력된 값인지 알 수 있도록 표시를 해봤어요!)

 

1. hello라는 function을 실행하는데 number1, number2를 넣어봐. 그리고 그걸 helloReturnValue라고 하자.

number1이라는 변수를 10이라고 선언했네!
number2라는 변수를 20이라고 선언했네!

 

funtion hello의 a, b에 각 각 number1(10), number2(20)를 넣어봐!

알겠어! 즉 console.log a, b에 number1(10), number2(20) 넣을게! 그럼 10+20이니까 30!!!!

>이렇게 첫번째 줄 30이 콘솔창에 로그되었어요!

 

   2. hello라는 function을 실행하는데 number3, number4를 넣어봐. 

 

number3라는 변수를 30이라고 선언했네!
number4라는 변수를 40이라고 선언했네!

 

funtion hello의 a, b에 각 각 number3(30), number4(40)를 넣어봐!

알겠어! 즉 console.log a, b에 number3(30), number4(40) 넣을게! 그럼 30+40이니까 70!!!!

>이렇게 두번째 줄 70이 콘솔창에 로그되었어요!

 

   3. hello라는 function을 실행하는데 number1, number2를 넣어!

 

number1이라는 변수를 10이라고 선언했네!
number2라는 변수를 20이라고 선언했네!

 

funtion hello의 a, b에 각 각 number1(10), number2(20)를 넣어봐!

알겠어! 즉 console.log a, b에 number1(10), number2(20) 넣을게! 그럼 10+20이니까 30!!!!

>이렇게 세번째 줄 30이 콘솔창에 로그되었어요!

 

  4.  hello라는 function을 실행하는데 number3, number4를 넣어!

 

number3라는 변수를 30이라고 선언했네!
number4라는 변수를 40이라고 선언했네!

 

funtion hello의 a, b에 각 각 number3(30), number4(40)를 넣어봐!

알겠어! 즉 console.log a, b에 number3(30), number4(40) 넣을게! 그럼 30+40이니까 70!!!!

>이렇게 네번째 줄 70이 콘솔창에 로그되었어요!

 

 

   5.  3번, 4번에서 했던 걸 console창에 보여줘!

 

3번 4번에서 실행한 걸 return 값이 저장해서 토스해주니까 당연히 console 창에 보낼 수 있지!

30 곱하기 70 이니까 2100이네!!

>이렇게 다섯 번째 줄 2100이 콘솔창에 로그되었어요!

 

 

 

제가 이해한 부분이 틀리다면 언제나 태클 가능합니다!

👏태클환영👏