자바스크립트 함수 구조 : 매개변수/ 인자/반환값

1. 매개변수(parameter)vs 인자(argument)

• 매개변수란? : 함수에 전달될 데이터를 담는 변수
• 인자란? : 함수 호출 시에 전달하는 값

***자바에서와는 다르게 타입 명시 불요

 

2. JS에서의 파라미터와 아규먼트 특징

파라미터와 아규먼트의 수가 반드시 일치할 필요가 없다. 

 

매개변수의 차례로 인자값이 전달되기 때문에 형식이 맞지 않아도 그대로 적용이 되어버릴 수 있는 문제점이 있다.

 

3. 반환값(return, 리턴값)

결과를 반환하며 함수 내에서 return 키워드가 읽히면 함수의 실행을 즉시 중단하고 return 뒤의 값을 반환한다.

return 뒤의 코드는 읽히지 않기 때문에 화면에 굉장히 희미하게 표시가 된다.

 

4. 함수 선언 방식 3가지

//함수 선언문
function square1(x) { return x * x; }
//함수 표현식
const square2 = function(x) { return x * x; };
//화살표 함수
const square3 = x => x * x;

console.log(square1(2), square2(3), square3(4)); // 4 9 16

 

5. 기본 매개변수(Default Parameter)

인자를 전달하지 않았을 때 사용할 기본값을 설정할 수 있습니다.

function greet(name = 'Guest') {
  console.log(`Hello, ${name}`);
}

greet(); // Hello, Guest
greet('Sam'); // Hello, Sam

✅ 주의: 값 전달의 선택이 있을 경우에 무조건적으로 값 할당이 필요한 데이터보다 뒤에 작성한다.

function greet(age, name = 'Guest') {
  console.log(`${name} is ${age} years old.`);
}

greet(30); // Guest is 30 years old.
greet(25, 'Tom'); // Tom is 25 years old.

 

6. 가변 매개변수 

함수 호출 시 인자 수를 고정하지 않고 함수 내부에서 유동적으로 처리한다.

7. 나머지 매개변수

• 자바스크립트에서는 나머지 매개변수로 가변 매개변수를 구현한다.
• 함수에 전달된 인자들을 배열의 형태로 전달받는다.

<구현방법>

• 매개변수 앞에 ...(spread 연산자)를 붙여 정의한다.
• 데이터가 지정될 변수가 있는 매개변수 목록들보다 마지막에 위치한다.

function spreadFunc(num1, num2, ...nums){
	console.log(nums);
}

 

<활용 - 최솟값 찾기>

function findMin(...numbers) {

  //? ...연산자(spread 연산자)
  //  : 배열의 요소들을 개별 인수로 펼치는 역할
  let minNum = Math.min(...numbers); // 배열의 요소만 전달(배열 자체의 형태 X)
  return minNum;
}