반응형
● 전개 연산자(Spread Operator)
- JavaScript에서 데이터를 확장하거나 복사할 때 사용
- 주로 배열과 객체를 다룰 때 사용
- ES6 (ECMAScript 2015) 문법
- "[Javascript] 배열 합치는 방법 5가지(concat, spread, push, Array.from, reduce)" 에서 소개된 문법
● 배열에서의 전개 연산자 예시
1. 배열 병합
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const mergedArray = [...arr1, ...arr2]; // [1, 2, 3, 4, 5, 6]
const arr3 = [7, 8, 9];
const mergedArray2 = [...arr1, ...arr2, ...arr3]; // [1, 2, 3, 4, 5, 6, 7, 8, 9]
2. 배열 복사
const originalArray = [1, 2, 3];
const copiedArray = [...originalArray]; // [1, 2, 3]
3. 배열 요소 추가 및 수정
const numbers = [1, 2, 3];
const updatedNumbers = [...numbers, 4, 5]; // [1, 2, 3, 4, 5]
● 오브젝트에서의 전개 연산자 예시
1. 오브젝트 병합
const firstObject = { x: 1, y: 2 };
const secondObject = { y: 3, z: 4 };
const mergedObject = { ...firstObject, ...secondObject }; // {x: 1, y: 3, z: 4}
2. 오브젝트 복사
const originalObject = { x: 1, y: 2 };
const copiedObject = { ...originalObject }; // {x: 1, y: 2}
3. 오브젝트 속성 추가 및 수정
const originalObject = { x: 1, y: 2 };
const copiedObject = { ...originalObject }; // { x: 1, y: 2 }
반응형
'Programming > Javascript' 카테고리의 다른 글
[Javascript] jQuery TableDnD를 이용하여 테이블 순번 바꾸기 (2) | 2023.11.02 |
---|---|
[Javascript] Debounce와 Throttle의 차이 (2) | 2023.11.01 |
[Javascript] val()과 attr("value")의 차이 (0) | 2023.08.24 |
[Javascript] jQuery Datepicker 특정 날짜만 선택 가능/불가능 설정 (0) | 2023.08.22 |
[Javascript] 배열 합치는 방법 5가지(concat, spread, push, Array.from, reduce) (0) | 2023.07.17 |
댓글