spread-operator 사용법

JooKit 주킷 2021. 1. 16. 14:49
목차 접기
728x90
반응형

Spread Operator

  • 함수를 호출할때 인수로 사용할 수도 있고
    배열 안에 들어갈 수도 있고, 객체 안에 들어갈 수도 있다.
  • spread-operator는 rest-operator와는 다르게
    함수를 호출해서 사용하기 때문에 중간에 낑겨 있어도 된다.

함수 호출에서 사용하는 방법

function sum(a, b, c )
{
    return a + b + c;
}

console.log(sum(10, 10, 10));


// 배열의 합을 계산해주는 함수 활용법
let arr = [10, 20, 30];
console.log(sum.apply(null, arr));


// 배열의 합을 계산하는 spread-operator 사용법
let arr2 = [100, 200, 300];
console.log(sum(...arr2));



// spread-operator를 함수 인자 중간에 사용하는법
function sum2 (a, b, c, d, e, f)
{
    return a + b + c + d + e + f;
}
console.log(sum2(1, 1, ...arr2, 1));


// 배열 안에서 사용하는 방법
let face = [ 'eyes', 'nose', 'mouth'];
let head = [ 'hair', ...face, 'ears'];
console.log(head);

// 배열 복사할 때 쓰이는 법 1
let arrayOrigin = [1, 2, 3];
let arrayCopy = arrayOrigin;
arrayCopy.push(4);
// arrayCopy에 의해 origin 배열도 영향을 받는다.
console.log(arrayOrigin);
console.log(arrayCopy);

// spread-operator를 사용해 origin에 영향을 주지 않는 배열 복사하는 방법
let arrayOrigin2 = [1, 2, 3];
let arrayCopy2 = [...arrayOrigin2];
arrayCopy2.push(4);
// arrayCopy에 의해 origin 배열도 영향을 받는다.
console.log(arrayOrigin2);
console.log(arrayCopy2);
728x90
반응형
LIST

'javascript' 카테고리의 다른 글

class, extends 설명  (0) 2021.01.16
spread-operater 객체 속성 복사하는 방법  (0) 2021.01.16
Rest Operator  (0) 2021.01.16
for 문(in, of) 사용법  (0) 2021.01.16
String Literal 사용법  (0) 2021.01.16