전개 연산자

 

● 전개 연산자란??

전개 연산자는 ECMAScript6(2015)에서 새롭게 추가되었으며, 특정 객체 또는 배열의 값ㅇ르 다른 객체, 배열로 복제하거나 옮길 때 사용한다.

연산자의 모양은 ... 이렇게 생겼다.

 

 

배열 조합 (새로운 배열 생성)

 

concat() 메서드보다 간결하고 가독성이 좋아지고 concat()의 경우는 기존 배열의 끝에서부터 추가만 되지만, 전개연산자는 기존 배열의 아무곳에나 추가할 수 있다.

 

 

 

 

 

배열 조합 (기존 배열 변경)

새로운 조합배열을 생성하는게 아닌 기존 배열에 요소를 추가한다면 push()메소드를 이용했었다.

 

 

전개연산자를 이용한 할당은 1차원에서만 유효하므로 다차원 배열을 복사하는것에는 적합하지 않을 수 있다.

 

 

 

 

 

배열 역순

 

arr1.reverse()를 사용한 첫번째는 원본의 배열까지 역순으로 변경되었지만

[...arr1].reverse()를 사용한 두번째는 원본 배열은 유지하고 arr2만 역순으로 된 것을 확인 할 수 있다.

 

 

 

 

배열 나머지 할당

전개연산자를 이용하면 특정 요소를 사용하고 나머지를 따로 할당 할 수 있다.

 

 

 

 

객체에서의 조합

 

(1) 에서는 객체 자체가 들어간 것이지만 전개연산자를 사용한 (2)에서는 객체 자체가 아닌 각각의 값이 할당된 것을 확인 할 수 있다.

 

 

 

 

문자열에서 사용예

1. 주어진 문자열의 길이가 4 혹은 6인 경우
2. 주어진 문자열이 '숫자'로만 이루어졌는지 확인

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

참고 : https://velog.io/@sarang_daddy/JS-%EC%A0%84%EA%B0%9C%EC%97%B0%EC%82%B0%EC%9E%90-Spread-Operator