[자바스크립트 js] Arguments 객체 / Rest Parameter

  Arguments

• Arguments 객체는 함수를 호출할 때, 전달한아규먼트들을 배열의 형태로 모아둔 유사배열 객체이다.
• 유사배열이므로, 배열의 메소드를 사용할 수 없다.
• 함수를 호출할 때 전달되는 아규먼트의 개수가 불규칙적일 때 유용하게 활용하자.
• 파라미터, 변수명, 함수명에 Arguments 사용 하지 않기.

 

 

  Argument를 다양하게 다루는 방법

1. 그 자체 사용하기, length, 인덱싱

function printArguments(a, b, c) {
	console.log(arguments);
    console.log(arguments.length);
    console.log(argumnets[0]);
    console.log(argumnets[1]);
}

printArguments('Tooktak', '뚝딱', '도깨비');
printArguments('Tooktak');
printArguments('Tooktak', '뚝딱');
printArguments('Tooktak', '뚝딱', '도깨비', '금나와라');

 

2. 반복문

function printArguments() {
	for (const arg of arguments) {
    	console.log(arg);
    }
}

printArguments('Tooktak', '뚝딱', '도깨비');
printArguments('Tooktak');
printArguments('Tooktak', '뚝딱');
printArguments('Tooktak', '뚝딱', '도깨비', '금나와라');

 

 

 

  Rest Parameter

• arguments 객체를 이용하는 것 말고도 불규칙적으로 전달되는 아규먼트를 다루는 방법.
• 파라미터 앞에 마침표 3개를 붙여주면, 여러 개로 전달되는 아규먼트들을 배열로 다룰 수 있다.
• arguments 객체는 유사배열이라 배열의 메소드를 활용할 수 없지만,
  rest parameter는 배열이기 때문에 배열의 메소드를 자유롭게 사용할 수 있다.

 

1. ...args를 사용하면 배열 메소드 사용 가능.

function printArguments(...args) {
	//args의 객체의 요소들을 하나씩 출력
	for (const arg of args) {
    	console.log(arg);
    }
}

printArguments('Tooktak', '뚝딱', '도깨비');
printArguments('Tooktak');
printArguments('Tooktak', '뚝딱');
printArguments('Tooktak', '뚝딱', '도깨비', '금나와라');

 

2. splice로 선택한 내용만 보이게 할 수 있다.

function printArguments(...args) {
	console.log(args.splice(0, 2));
    console.log(arguments.splice(0, 2));
}

printArguments('Tooktak', '뚝딱', '도깨비');
printArguments('Tooktak');
printArguments('Tooktak', '뚝딱');
printArguments('Tooktak', '뚝딱', '도깨비', '금나와라');




// (2) ["Tooktak", "뚝딱"]
// Uncaught TypeError

 

3. 일반 파라미터와 함께 사용 가능

• 정의된 파라미터에 argument를 먼저 할당하고, 나머지 argument를 배열로 묶는 역할을 하기 때문에
  일반 파라미터와 함께 사용할 때는 반드시 가장 마지막에 작성하자.

function printWork(first, second, ...others) {
	console.log('뚝딱이 잘하는 것');
    console.log(`첫번째 : ${first}`);
    console.log(`두번째 : ${second}`);
    for (const arg of others) {
    	console.log(`그 외 : ${arg}`);
    }
}

printWork('UXUI', '자바스크립트', '디자인', '기획', '존버')


// 뚝딱이 잘하는 것
// 첫번째 : UXUI
// 두번째 : 자바스크립트
// 그 외 : 디자인
// 그 외 : 기획
// 그 외 : 존버