본문 바로가기

언어/javascript

javascript : apply(), 전개 연산자

반응형

함수를 호출할 때의 전개 연산자

 

함수를 호출할 때도 전개 연산자를 사용할 수 있습니다. 일반적으로 '배열의 요소를 하나하나 매개변수로 넣고 싶은데'라고 할 때, ECMAScript 5까지는 다음과 같은 코드를 사용해야 했음..

 

 

function test(a, b, c, d) {
    console.log(a + ':' + b + ':' + c + ':' + d);
}

var array = [1, 2, 3, 4];
test.apply(null, array);

 

모든 함수에는 apply() 메서드가 있다. apply() 메서드는 첫 번째 매개변수로는 '함수 내부에서 활용할 this 키워드 객체', 두 번째 매개변수로는 '매개변수 배열'을 넣게 됩니다. 단, 첫 번째 매개변수를 잘못 사용하면 문제가 되는 경우가 많고, 코드의 가독성이 굉장히 떨어집니다.

 

그래서 ECMAScript 6 에서는 전개 연산자로 함수를 호출할 때 배열을 전개해서 넣을 수 있게 했다.

function test(a,b,c,d){
    console.log(`${a}:${b}:${c}:${d}`);
}

var array = [1,2,3,4];
test(...array);

그냥 매개변수를 전달할 때 배열 앞에 전개 연산자를 입력하면 된다. 추가로 전개 연산자를 사용하면, 다음과 같은 형태로도 사용할 수 있다.

 

function test(a, b, c, d) {
    console.log(`${a}:${b}:${c}:${d}`);
}

var array = [1, 2];

test(273, 52, ...array);

test(...array, ...array);
273:52:1:2
1:2:1:2

 

반응형