Programming/Javascript

[9일차] JavaScript 함수의 매개변수와 반환값 이해하기

tech-living 2024. 11. 15. 11:23

 

목차:

  1. 함수 매개변수란?
  2. 여러 개의 매개변수 사용하기
  3. 기본 매개변수 설정하기
  4. 반환값 이해하기
  5. 함수의 결과를 변수에 저장하기
  6. 예제 실습

1. 함수 매개변수란?

매개변수는 함수에 전달되는 입력 값입니다. 함수를 호출할 때 매개변수 값을 전달하면, 함수는 이를 활용해 작업을 수행합니다. 매개변수는 함수 선언 시 괄호 안에 정의하며, 함수 내부에서 변수처럼 사용할 수 있습니다.

 

예제:

function greet(name) {
    console.log("안녕하세요, " + name + "님!");
}

greet("홍길동"); // "안녕하세요, 홍길동님!" 출력

위 코드에서 greet 함수는 name이라는 매개변수를 받아 인사말을 출력합니다.


2. 여러 개의 매개변수 사용하기

함수는 여러 개의 매개변수를 가질 수 있습니다. 여러 개의 값을 입력받아야 할 경우, 쉼표로 구분하여 매개변수를 추가할 수 있습니다.

 

예제:

function add(a, b) {
    return a + b;
}

console.log(add(3, 5)); // 8 출력

위 예제에서는 add 함수가 ab 두 매개변수를 받아 그 합을 반환합니다.

 


3. 기본 매개변수 설정하기

기본 매개변수는 함수 호출 시 매개변수 값이 전달되지 않았을 때 사용할 기본값을 설정하는 방법입니다. ES6(ECMAScript 2015)에서 추가된 기능으로, 함수 선언 시 매개변수에 기본값을 지정할 수 있습니다.

 

예제:

function greet(name = "손님") {
    console.log("안녕하세요, " + name + "님!");
}

greet(); // "안녕하세요, 손님님!" 출력
greet("홍길동"); // "안녕하세요, 홍길동님!" 출력

위 코드에서는 name 매개변수의 기본값으로 "손님"을 설정했습니다. 따라서 함수 호출 시 이름이 전달되지 않으면 "손님"이라는 이름을 사용합니다.

 


4. 반환값 이해하기

함수는 작업을 수행한 후 결과를 반환할 수 있습니다. 이를 반환값이라고 하며, return 키워드를 사용하여 함수의 결과를 함수 외부로 전달할 수 있습니다. 반환값이 있는 함수는 결과를 호출한 위치로 보내, 다른 작업에 활용할 수 있습니다.

 

예제:

function multiply(a, b) {
    return a * b;
}

const result = multiply(4, 5); // 20 저장
console.log(result); // 20 출력

위 예제에서 multiply 함수는 두 숫자를 곱한 결과를 반환합니다. 이 반환값은 result 변수에 저장되고 console.log를 통해 출력할 수 있습니다.

 


5. 함수의 결과를 변수에 저장하기

함수 호출의 결과를 변수에 저장할 수 있습니다. 이를 통해 여러 번 계산하거나 결과를 저장해 나중에 활용할 수 있습니다.

 

예제:

function getCircleArea(radius) {
    return Math.PI * radius * radius;
}

const area = getCircleArea(5); // 반지름 5의 원 면적 계산
console.log("원의 면적:", area);

위 코드에서 getCircleArea 함수는 반지름을 입력받아 원의 면적을 계산해 반환합니다. 함수의 반환값을 area 변수에 저장하여 쉽게 사용할 수 있습니다.

 


6. 예제 실습

  1. 최댓값 함수 만들기
    function max(a, b) {
        return a > b ? a : b;
    }
    
    console.log(max(10, 20)); // 20 출력
    console.log(max(30, 15)); // 30 출력
  2. 두 숫자를 입력받아 더 큰 숫자를 반환하는 함수를 작성해 보세요.
  3. 나이 확인 함수 만들기
    function checkAge(age) {
        return age >= 18 ? "성인" : "미성년자";
    }
    
    console.log(checkAge(20)); // "성인" 출력
    console.log(checkAge(16)); // "미성년자" 출력
  4. 나이를 입력받아 18세 이상이면 "성인"을, 그렇지 않으면 "미성년자"를 반환하는 함수를 만들어 보세요.
  5. 기본 매개변수 예제
    function multiply(a, b = 1) {
        return a * b;
    }
    
    console.log(multiply(5)); // 5 출력 (5 * 1)
    console.log(multiply(5, 3)); // 15 출력 (5 * 3)
  6. 두 개의 숫자를 곱하는 함수를 작성하되, 두 번째 숫자의 기본값을 1로 설정해 보세요.


정리 및 다음 단계

오늘은 함수의 매개변수와 반환값에 대해 학습해 보았습니다. 매개변수와 반환값을 활용하면 함수를 더 유연하고 실용적으로 사용할 수 있습니다. 다음 시간에는 반복문(for, while, do...while)에 대해 배워 보겠습니다.