Splice()

splice 메서드는 배열의 구성요소를 삭제하거나 교체(replacing)하는 메서드이며,

삭제된 배열이 반환된다.

 

문법은 아래와 같다

let 배열에서삭제된요소 = 배열.splice(시작인덱스[, 삭제할갯수 [, 추가요소 1 [, 추가요소 2]]])

 

문법만 보면 이해가 어려우니 직접 실습해보자.

---

const fruits = ['사과', '딸기', '참외', '수박', '복숭아']
const a = fruits.splice(-2, 1)
console.log(fruits);
console.log(a);

위에 fruits라는 배열이 있다.

 

빠른 이해를 위해 splice에는 음수값을 넣었다.

이해하기 쉽게 표로 만들어보자.

fruits 배열	사과	딸기	참외	수박	복숭아
index	0	1	2	3	4
거꾸로 index	-5	-4	-3	-2	-1

 

fruits.splice(-2, 1)를 코드하면

fruits배열의 -2 지점인 수박부터 사라지게 된다. 이때 삭제할 배열은 1개이며

이 때문에 수박이 사라지게 된다.

 

그렇게되면 배열은 ['사과', '딸기', '참외', '복숭아'] 가 되고

splice는 '수박'을 반환한다.

  

---

이번엔 중간의 값을 삭제하고, 새로운 값을 추가한다.

const fruits = ['사과', '딸기', '참외', '수박', '복숭아']
const a = fruits.splice(2, 1, '삼겹살', '안심')
console.log(fruits);
console.log(a);

index는 0, 1, 2 의 순서대로 간다.

시작점은 2번 인덱스인 참외이고, 삭제할 요소는 1개이며, 추가할 요소는 '삼겹살'과 '안심'이다.

따라서 이를 실행하면 아래와 같은 답이 나온다.

 

 

---

const fruits = ['사과', '딸기', '참외', '수박', '복숭아']
const a = fruits.splice(3)
console.log(fruits);
console.log(a);

위와 같은 코드는 어떨까?

 

이 경우 3번 인덱스부터 죄다 잘라가겠다는 의미가 된다.

 

따라서 fruits는 ['사과', '딸기', '참외'] 가 된다.

이를 반환받은 a는 ['수박', '복숭아'] 가 된다.