[Java Script] slice, splice 차이 / 배열에서 원하는 요소를 삭제, 추가하는 방법

.slice()

배열을 복사하는 함수이다.

원본배열이 유지된다.

let arr  = [0,1,2];
let arr2 = arr.slice(0,2); // arr2 = [0,1]
// arr  = [0,1,2]

index번호 0번 부터 2번 앞짜리 까지 복사했다는 의미

원본 arr에는 여전히 3개가 있다.

---

.splice()

배열 중간에 원소를 삭제 및 추가하는 함수이다.

원본배열이 변경된다.

 

array.slice(start index, deleteCount, items...)

 

splice() 함수는 파라미터로 start, deleteCount, items를 받는다.

start index부터 deleteCount 만큼 원소 개수를 삭제하고

items를 start index에 추가한다.

 

deleteCount가 입력되지 않은 경우, start index 이후의 모든 값이 삭제된다.

 

 

let arr  = [0,1,2];
let arr2  = arr.splice(0,1); // arr2 = [0]
// arr = [1,2]

 

index번호 0번 부터 1번 앞짜리 까지 잘라냈다는 의미이다.

원본인 arr에는 arr3으로 잘려나갔기 때문에 arr = [1,2] 표시된다.

---

.splice() 인덱스 (앞번호 = 뒷번호) 의 경우 

arr  = [0,1,2]
let arr2 = arr.splice(1,1); // arr2 = [1]
// arr = [0,2]

 

잘라내려는 인덱스 번호가 같은 경우 배열에서 해당 index번호의 요소를 잘라낸다고 생각하면 된다.

---

.splice() 인덱스 (앞번호 < 뒷번호) 의 경우

arr  = [0,1,2]
let arr2 = arr.splice(1,2); // arr2 = [1,2]
// arr = [0]

 

뒤에 있는 인덱스 번호가 앞에 있는 인덱스 번호보다 크면,

앞의 인덱스 번호부터 뒤의 인덱스 번호의 개수 만큼 잘라냈다고 생각하면 쉽다.

 

.splice()로 배열의 중간에 값 추가하기

let arr  = [0,1,2,'b','c'];
let arr2  = arr.splice(0,3,'a'); // arr2 = [0, 1, 2] arr에서 0부터 3개 삭제, 'a'추가
// arr = ['a','b','c']

array.slice(start index, deleteCount, items...) 를 참고하여

start index     0부터

deleteCount     3개의 원소를 삭제하고 

items     'a'를 추가했다.