[JavaScript]ES5와 ES6의 차이(4) - Default Parameter, Rest Parameter

ES5와 ES6의 차이(4) - Default Parameter, Rest Parameter

Default Parameter

argument 입력받을 때 =으로 초기화해줄 수 있음

  <script>
    // ES6 기반으로 함수 정의하세요
    // 이름, 나이 정보를 받아서 "이름"님은 "00"살입니다. 출력
    const doA = (name, age) => `${name}님은 ${age}살 입니다.`;
    console.log(doA("강감찬", 90));
    console.log(doA("강감찬"));

    // default parameter: 매개변수명 = 기본값, 전달한 값이 없는 경우에는 기본값 처리
    const doB = (name, age = 29) => `${name}님은 ${age}살 입니다.`;
    console.log(doB("홍길동", 88));
    console.log(doB("홍길동"));

    // 2개의 숫자를 전달 받아서 덧셈 결과를 반환하는 함수
    const sum = (number1, number2) => number1 + number2;
    console.log("sum = ", sum(1 , 2));
  </script>

실행 결과(Default Parameter)

 

 

Rest Parameter

ES6으로 넘어오면서 가변 매개 변수 쌉가능!

...을 이용해주면 됨!!

  <script>
    // 2개의 숫자를 전달 받아서 덧셈 결과를 반환하는 함수
    const sum = (number1, number2) => number1 + number2;
    console.log("sum = ", sum(1 , 2));

    // 2개, 3개, 4개, ...xx개의 숫자를 전달 받아서 처리해야 하는 경우
    // rest parameter: 가변 매개변수 => 데이터 타입 배열 객체
    const sumRest = (...numbers) => {
      let sum = 0;
      numbers.forEach(number => {
        sum += number;
      });
      return sum;
    };
    console.log("sumRest = ", sumRest(1, 2, 3, 4, 5));

    // 실습
    // 첫번째는 지역반(개나리반), 두번째는 이름(홍길동), 가변매개변수 응시과목수 점수들 전달받아
    // 출력: 개나리반 홍길동님 총점 000 평균 00
    // 평균은 소수 이하 버림 처림: parseFloat(), parseInt()
    // 메서드 이름(arg1, arg2, ...args): 
    // 매개변수가 고정(위치기반)과, 가변 매개변수가 함께오는 경우에는
    // 가변 매개변수는 맨 뒤에 위치해야함
    const printInfo = (team, name, ...scores) => {
      let total = 0;
      let avg = 0;
      for (score of scores) {
        total += score;
      }
      // scores.forEach(score => {
      //   total += score;
      // });
      avg = parseInt(total/scores.length);
      return `${team}반 ${name}님 총점 ${total} 평균 ${avg}`
    }
    console.log(printInfo("개나리", "홍길동", 40, 20, 30, 100));

  </script>

실행 결과(Rest Parameter)