[JS] Syntax | 11. rest parameter - 가변 변수 사용하기

2025. 3. 29. 19:51·Language/JavaScript

1. argument

argument는 함수에서 가변적인 매개변수들을 받아 접근할 때 사용할 수 있습니다.

 

argument는 유사 리스트의 형태로 반환되어 리스트와 관련된 메소드를 사용할 수는 없습니다.

 

단, argument.length와 argument[0] 등의 인덱스 접근은 가능합니다.

const func1 = (arg1, arg2) => {
    console.log(arg1);
    console.log(arg2);
}

func1(1);        // 1, undefined
func1(1, 2);     // 1, 2
func1(1, 2, 3);  // 1, 2 (3은 출력되지 않음)

const func2 = (arg1, arg2) => {
    for (const arg of arguments){
        console.log(arg);
    }
}

func2(1);        // 1
func2(1, 2);     // 1, 2
func2(1, 2, 3);  // 1, 2, 3

2. rest parameter

앞서 말했듯이 argument는 유사 배열의 형태를 하고 있기 때문에, 배열에서 사용하는 모든 메소드들을 사용할 수 없다는 단점이 있었습니다.

 

rest parameter는 이런 문제점을 보완하여 보다 편리하게 가변변수를 다룰 수 있습니다.

 

const func3 = (...args) => {  // ...[매개변수 이름] 형식으로 사용합니다.
    for (const arg of args){
        console.log(arg);
    }
    
    console.log(args.splice(1)); // 배열 메소드도 사용할 수 있습니다.
}

func3(1);        // 1        []
func3(1, 2);     // 1, 2     [2]
func3(1, 2, 3);  // 1, 2, 3  [2, 3]

 

rest parameter는 매개변수의 제일 마지막에 선언해주어야 합니다.

 

그래서 'rest' parameter 입니다.

const func3 = (arg1, arg2, ...args) => {
    console.log('arg1 is', arg1);
    console.log('arg2 is', arg2);

    for (const arg of args){
        console.log(arg);
    }
}
728x90

'Language > JavaScript' 카테고리의 다른 글

[JS] Syntax | 13. Spread - 배열 또는 객체 분해하기  (0) 2025.04.02
[JS] Syntax | 12. Arrow function  (0) 2025.03.31
[JS] Syntax | 10. 병합연산자(??)  (0) 2025.03.23
[JS] CommonJS & ES에 대해서  (0) 2025.03.21
[JS] Library | 02. Papaparse  (0) 2024.12.10
'Language/JavaScript' 카테고리의 다른 글
  • [JS] Syntax | 13. Spread - 배열 또는 객체 분해하기
  • [JS] Syntax | 12. Arrow function
  • [JS] Syntax | 10. 병합연산자(??)
  • [JS] CommonJS & ES에 대해서
Rayi
Rayi
  • Rayi
    아카이브
    Rayi
  • 전체
    오늘
    어제
    • 분류 전체보기 (276)
      • CS (40)
        • CV (2)
        • PS (34)
      • Reveiw (18)
        • Paper (18)
        • Github (0)
      • ML (8)
        • Pytorch (5)
      • Language (59)
        • Python (8)
        • JavaScript (32)
        • TypeScript (16)
        • C++ (3)
      • IDE (12)
      • Git (13)
      • Frontend (77)
        • React (8)
        • ReactNative (6)
        • SolidJS (20)
        • CSS (12)
      • Backend (44)
        • DB (18)
        • Node.js (11)
      • UI (3)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    mongo
    Express
    CV
    figma
    ML
    backend
    review
    deploy
    CS
    PRISMA
    expo
    PyTorch
    python
    postgresql
    ts
    js
    Three
    modal
    GAN
    ReactNative
    react
    Git
    vscode
    nodejs
    ps
    SOLID
    CSS
    DB
    frontend
    API
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.5
Rayi
[JS] Syntax | 11. rest parameter - 가변 변수 사용하기
상단으로

티스토리툴바