1. 전개 연산자를 활용한 배열 합치기 ( Spread Operator(...) )
전개 연산자를 사용한 배열 병합
<script>
const arrayA = [1, 2, 3, 4, 5];
const arrayB = [52, 273, 99, 100, 101];
const newArray = [...arrayA, ...arrayB];
console.log(newArray); // [ 1, 2, 3, 4, 5, 52, 273, 99, 100, 101 ]
</script>
전개 연사자를 사용한 배열 병합 2
<script>
const originalArray = [52, 273, 55, 45];
const newArrayA = [1, 2, 3, 4, 5, ...originalArray];
const newArrayB = [...originalArray, 1, 2, 3, 4, 5];
console.log(newArrayA); // [ 1, 2, 3, 4, 5, 52, 273, 55, 45 ]
console.log(newArrayB); // [ 52, 273, 55, 45, 1, 2, 3, 4, 5 ]
</script>
...originalArray처럼 전개연산자는 originalArray의 원소들을 쪼개어 개별요소로 리턴합니다.
2. .push()를 사용한 배열 합치기
<script>
const array1 = [1, 2, 3, 4, 5];
const array2 = [6, 7, 8, 9, 0];
array1.push(array2);
console.log(array1.length); // 6
console.log(array1[5]); // [ 6, 7, 8, 9, 0 ]
</script>
.psh()를 사용하여 배열을 합치면 파라미터로 전달된 배열을 하나의 원소로 처리가 됩니다.
그러므로, 합쳐진 array1의 length는 10이 아닌 6이 되고, array1[5]의 원소는 [ 6, 7, 8, 9, 0 ]이 출력됩니다.
3. 전개 연산자와 .push()를 활용한 배열 합치기
<script>
const array1 = [1, 2, 3, 4, 5];
const array2 = [6, 7, 8, 9, 0];
array1.push(...array2);
console.log(array1.length); // 10
console.log(array1[5]); // 6
</script>
전개 연사자는 배열의 원소들을 쪼개어 개별요소로 리턴한다고 했습니다.
그렇기 때문에 2번처럼 하나의 원소가 아닌 개별원소로 처리가 됩니다.
그러므로, array1의 length는 10이 되며, array1[5]의 원소는 6이 출력됩니다.
4. .concat()을 사용한 배열 합치기
<script>
const array1 = [1, 2, 3];
const newArray = array1.concat('a', 'b', ['c', 'd'], 'e');
console.log(newArray.length); // 8
console.log(newArray); // [ 1, 2, 3, 'a', 'b', 'c', 'd', 'e' ]
</script>
.concat()은 array1과 전달받은 파라미터들을 합쳐서 새로운 배열을 생성하여 리턴합니다.
이 때, 파라미터가 배열일 경우 배열 안의 원소들을 뽑아서 새로운 배열에 추가합니다.
그러므로, [ 'c', 'd' ] 배열이 하나의 원소로 취급되지 않아서 newArray.length가 7이 아닌 8이 됩니다.
