splice 메서드

splice는 삭제, 추가, 교체 등 여러 작업을 한 번의 호출로 수행할 수 있어 매우 유용한 메서드다.

 

다음은 splice로 삭제하는 코드다.

this.images.splice(index, 1);
이와 같이 splice 함수가 사용됐다고 해보자.

이 함수는 images 배열 중 현재 선택된 index의 요소 1개를 삭제해준다.

this.images.splice(index, 2);

그럼 만약 이렇게 인자를 2로 두면 어떻게 될까?

그러면 index와 index+1의 요소가 삭제되게 된다.

 

다음은 요소 추가하는 코드

splice(2, 0, 'grape', 'kiwi')

인덱스 2 위치에 새로운 요소들을 추가한다. 0은 제거할 요소가 없음을 나타낸다.

 

다음은 요소 교체 코드

splice(1, 2, 'mango', 'orange')

인덱스 1부터 2개의 요소를 제거하고 그 자리에 새로운 요소들을 추가한다.

 

배열의 끝에 새 요소도 추가할 수 있다.

splice(fruits.length, 0, 'papaya')

 

배열의 시작에도 물론 추가할 수 있다.

splice(0, 0, 'fig')

 

이처럼 splice는 매우 좋은 도구이지만 원본 배열을 직접 수정한다는 점에 주의해야 한다.