전개 연산자 (Spread Operator)

이토니·2024년 2월 1일

React

목록 보기
2/3
post-thumbnail

전개 연산자란?

특정 객체 or 배열의 값을 다른 객체, 배열로 복제하거나 옮길 때 사용한다.

... <- 이것이 전개연산자이다.

배열 조합

const arr1 = [1,2,3];
const arr2 = [4,5,6];

방법 1: concat

const arrWrap = arr1.concat(arr2);

방법 2: ...

const arrWrap = [...arr, ...arr2]

객체 조합

const obj1 = {
    a: 'A',
      b: 'B'
  };
const obj2 = {
    c: 'C',
    d: 'D'
  };

방법1: 객체 자체가 들어감

const objWrap = {obj1, obj2}
결과 -> obj1과 obj1의 값이 통째로 들어감. (obj2도 마찬가지임)

방법2: 객체가 아닌 각각의 값이 할당됨

const objWrap = {...obj1, ...obj2};
결과 -> obj1의 값인 a:'A', b:'B'가 들어감. (obj2도 마찬가지임)

기존 배열을 보존

const arr = [1,2,3];
const arr2 = arr.reverse();

-> 원본 배열까지 역순으로 변경되어버림.

const arr = [1,2,3];
const arr = [...arr1].reverse();

-> 원본 배열 유지

https://www.inflearn.com/course/lecture?courseSlug=%EB%94%B0%EB%9D%BC%ED%95%98%EB%8A%94-%EB%A6%AC%EC%95%A1%ED%8A%B8&unitId=119850&tab=curriculum

profile
cool & soft codes

0개의 댓글