본문 바로가기
Javascript

Javascript - Rest Parameter

by DGK 2021. 9. 30.

 

인프런 자바스크립트 입문 수업을 듣고 중요한 내용을 정리했습니다.
개인 공부 후 자료를 남기기 위한 목적이므로 내용 상에 오류가 있을 수 있습니다.

 

Rest Parameter

 

  • Rest Parameter 란?
함수의 n개 Parameter를 한 번에 처리하는 기능이다.

<기본 개념>
//Rest Parameter를 사용하지 않는 경우

function sum(x1, x2){

	var y = x1 + x2;
	console.log(y);
	return y;
       
 }

sum(5, 7);		// 결과 : 12(파라미터 2개의 합)


function sum2(x1, x2, x3){

	var y = x1 + x2 + x3;
	console.log(y);
	return y;
    
 }

sum2(5, 7, 3);		// 결과 : 15(파라미터 3개의 합)


function sum3(x1, x2, x3, x4){

	var y = x1 + x2 + x3 + x4;
	console.log(y);
	return y;
    
 }

sum3(5, 7, 3, 7);	// 결과 : 22(파라미터 4개의 합)



//Rest Parameter를 사용하는 경우(n개의 Parameter를 한 번에 처리하는 기능)

function sum4(...A){ 
	
    var total = 0;
	for(var x of A){ 
	total += x;  
 	}
	console.log(total);
	return total;
    
 }

sum4(3,2,4,5,6,7,8);		// 결과 : 35
sum4(3,5,2,1,6);		// 결과 : 17
sum4(19,49,3);			// 결과 : 71


//함수의 전달인자(n개)가 파라미터(...A)에 들어가면서 배열형태로 바뀌게 되고,
//배열 형태의 파라미터 값들을 모두 불러내는 for-of문을 함께 사용하여 전달인자의
//개수에 상관없이 해당 코드를 실행한 후 값을 도출한다.

//또한, 파라미터 ...A에서 A는 어떤 문자를 써도 상관이 없다.

 

 

  • 참고 : Rest Parameter와 무관한 내용
for-of문 대신 배열의 내장함수인 forEach(  ) 함수를 사용하여 동일한 결과를 만들 수 있다.
function sum5(...B){	

	var total = 0;
	B.forEach(function(x){	
	total += x;
	});
	console.log(total);
	return total;
        
}

sum5(3,2,4,5,6,7,8);		// 결과 : 35


//forEach( ) 함수는 sum 함수의 전달인자를 하나씩 가져와서,
//forEach( ) 안에 있는 function( )의 파라미터 x에 넣어주는 함수이다.

//여기서 B도 배열의 형태이며, B대신 어떤 문자를 써도 상관없다.



function sum6(...C){ 

	var total = 0;
	C.forEach(function(x, index){     
	console.log(index);
	total += x;
	});
	console.log(total);
	return total;
       
}

sum6(3,2,4,5,6,7,8);		

// 결과 :
//0
//1
//2
//3
//4
//5
//6
//35


//만약 배열 C의 인덱스 번호도 함께 알고싶은 경우에는,
//forEach( ) 함수의 두 번째 파라미터로 index를 넣어주면 된다.
        
//여기서 C도 배열의 형태이며, C대신 어떤 문자를 써도 상관없다.

'Javascript' 카테고리의 다른 글

Javascript - Template Literals  (0) 2021.09.30
Javascript - Arrow Function  (0) 2021.09.30
Javascript - Default Function Parameter  (0) 2021.09.27
Javascript - Scope  (0) 2021.09.27
Javascript - this 키워드  (0) 2021.09.27

댓글