September 24, 2021

배열은 다양한 메서드를 제공합니다. 학습 편의를 위해 본 챕터에선 배열 메서드를 몇 개의 그룹으로 나눠 소개하도록 하겠습니다.

arr.splice(start)는 만능 스위스 맥가이버 칼 같은 메서드입니다. 요소를 자유자재로 다룰 수 있게 해주죠. 이 메서드를 사용하면 요소 추가, 삭제, 교체가 모두 가능합니다.

문법은 다음과 같습니다.

arr.splice(index[, deleteCount, elem1, ..., elemN])

첫 번째 매개변수는 조작을 가할 첫 번째 요소를 가리키는 인덱스(index)입니다. 두 번째 매개변수는 deleteCount로, 제거하고자 하는 요소의 개수를 나타냅니다. elem1, ..., elemN은 배열에 추가할 요소를 나타냅니다.

음 예시에선 요소 세 개(3)를 지우고, 그 자리를 다른 요소 두 개로 교체해 보도록 하겠습니다.

let arr = [*"I", "study", "JavaScript",* "right", "now"];

// 처음(0) 세 개(3)의 요소를 지우고, 이 자리를 다른 요소로 대체합니다.
arr.splice(0, 3, "Let's", "dance");

alert( arr ) // now [*"Let's", "dance"*, "right", "now"]

splice는 삭제된 요소로 구성된 배열을 반환합니다. 아래 예시를 통해 확인해 봅시다.

let arr = [*"I", "study",* "JavaScript", "right", "now"];

// 처음 두 개의 요소를 삭제함
let removed = arr.splice(0, 2);

alert( removed ); // "I", "study" <-- 삭제된 요소로 구성된 배열

slice

arr.slice는 arr.splice와 유사해 보이지만 훨씬 간단합니다.

문법:

arr.slice([start], [end])

이 메서드는 "start" 인덱스부터 ("end"를 제외한) "end"인덱스까지의 요소를 복사한 새로운 배열을 반환합니다. start와 end는 둘 다 음수일 수 있는데 이땐, 배열 끝에서부터의 요소 개수를 의미합니다.

arr.slice는 문자열 메서드인 str.slice와 유사하게 동작하는데 arr.slice는 서브 문자열(substring) 대신 서브 배열(subarray)을 반환한다는 점이 다릅니다.