DAY6 return 이해하기

summerrrrr·2023년 2월 20일
1


드디어 자바스크립트 첫 날이다. 다행히 아직 공포의 반복문을 만나기 전이라 코플릿 문제들을 나름 수월하게 풀었긴 한데 페어님께 설명해주면서 나도 모르게 당연하게 여기던 것을 이유도 모르고 쓰고있다는 사실을 발견했다. return자리를 정하면서 왜 저기 있어야하는지 모르고 설명도 못하길래 오늘 블로그 주제로 잡았다.

📌 Return

함수 내에서 사용되며 함수를 호출한 부분으로 데이터를 전달해주기 위해서 사용한다.

  • 함수를 호출할때 함수로 데이터를 전달하는 방법 => 인수,매개변수
  • 함수에서 함수를 호출하는쪽으로 데이터를 전달하는 방법 => return

📍일반적인 함수 호출 원리

  1. 선언된 함수를 자바스크립트 어딘가에서 호출하게 되면 함수의 중괄호 영역에서 작성된 코드가 순차적으로 실행된다.
  2. 작성된 코드가 끝나게 되면 함수가 끝나게 된다.
function sum(num1,num2) {
	console.log(num1+num2);
}
sum(10,20);

만약 함수를 호출한 쪽(sum)에서 사용한 인수의 합이 얼마인지 알고싶어도 알 수 가 없다. 즉 활용할 수 없다.

function sum(num1,num2) {
	return num1+num2;
}
sum(10,20);

const a = sum(10,20)//30
const b = sum(20,30)//50
const result = a+b;
console.log(`총 합은 ${result} 입니다.`); //총 합은 80입니다.

하지만 return키워드를 사용하게 되면 함수 내부에서 return 키워드로 작성된 문법이 실행되는 순간 호출부분으로 데이터를 전달(반환)하게 된다.

이렇게 전달받은 데이터는 함수를 호출하는 부분에서 변수를 선언해서 저장할 수 있으며 저장된 변수는 자바스크립트 코드에서 활용할 수 있게 된다.

function sum(num1,num2) {
	console.log('return 전'); //출력됨
	return;
	console.log('return 후'); //출력안됨
}

sum();

이 코드 처럼 반환할 데이터를 적어주지 않고 return 만쓰면 아무것도 반환하지 않고 그 즉시 종료된다. return 문 다음에 있는 코드는 실행되지 않는다.

📎 참고한 유튜브


📝 오늘의 회고
✔️ 코플릿을 주말에 미리 풀어놔서 페어님 문제푸는모습을 지켜보았는데 나랑 전혀다른 접근방식이 흥미로웠다. 앞으로 난이도가 점점 높아지면 미리 풀어놓지도 못할것 같은데 그때마다 페어님과 같이 문제해결시간만 기다려질것 같다. 😂

✔️ 스터디활동도 이번주부터 본격적으로 시작이다. 블로그 적고 얼른 영어스터디 과제도 해야한다. 아티클 하나읽고 잘껀데 오늘따라 유난히 피곤하다 그래도 체크리스트 다 해치워보자!🌝💪🏻

profile
안녕하세오

0개의 댓글