[Javascript] Array의 slice와 splice의 차이

slice()

slice 함수는 Array에서 String의 substring와 같은 기능을 가지고 있는 함수이다. 즉 Array의 내용의 시작과 끝을 받아서 뽑아주는 기능이다. 문법을 보자면 아래와 같다.

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

발췌: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice

중요한 건 2번째 인자의 이름이 end라는 것. 이 차이를 아는 게 중요하다. substr, substring의 차이도 마찬가지인데 어느걸로 기준점을 잡느냐의 차이이다. end 또는 indexEnd 등의 이름으로 사용하는 인자는 시작 주소 0을 기준으로 잡는다. 따라서 기준점이 begin과 같다. 하지만 length로 이름을 쓰는 인자는 시작주소를 기준점으로 잡는다. 절대주소와 상대주소쯤으로 생각하면 쉬울 것 같다.

그리고 혹시 대괄호의 의미를 모르는 사람이 있을까봐 설명하자면 Optional한 인자라는 뜻이다. Javascript 문법에는 인자가 필요 없을 때가 있으면 안 넣어도 되게 시그니처를 설정할 수 있다. 그렇기 때문에 Optional한 인자라는 표시가 필요한데 그게 바로 대활호 []이다. Java에서는 Overlading을 통하거나 동적인자를 통해 이런 기능처럼 사용하게 할 순 있으나 구현에서 차이가 나기 때문에 좀 다르다.

splice()

splice 함수는 리턴값만 보면 slice 함수와 같지만 기대하는 기능은 전혀 다르다. slice 함수는 추출의 의미로 사용되는 함수이지만 splice는 삭제의 의미로 사용하는 함수이다. 그리고 추가적으로 삭제된 자리에 값들을 넣는 기능이 있다.

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

발췌: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

slice와 다르게 2번 인자는 count로 넣어야 한다. start 인자 다음에 몇 개를 지울 것이냐라고 보면 되고, item1, item2 들은 지울 자리에 추가로 넣을 값을 입력하면 된다. deleteCount 인자부터는 옵션이기 때문에 안 넣어도 동작한다.

Result를 보면 알겠지만 삭제되기 때문에 매번 arr의 데이터를 새로 주입했다. 그리고 예제처럼 Array의 값을 삭제할 때 사용할 수 있지만 반대로 주입할 때도 사용할 수 있다.(4번 참고)

Javascript에서는 delete 키워드가 있어서 delete array[ 1 ] 이런 식으로 삭제할 수 있겠지만 단일 항목밖에 삭제할 수 없고 무엇보다 빈공간이 생겨버리는 문제가 있다. 따라서 Array 요소 삭제 기능은 그냥 이 splice를 사용하는 게 맘 편하다.