splice()

배열의 요소를 삭제, 교체하거나 새로운 요소를 추가하여 기존 배열을 변경한다. 그리고 변경된 배열을 반환한다.

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

배열 중간의 요소 삭제

const totalUsers = users.splice(1,1); //1번 인덱스 요소부터 1개 삭제
console.log(totalUsers); // [ 'Cecilia' ] => 삭제된 요소 반환
console.log(users); // [ 'Charles', 'Den' ] => 변경된 배열 반환

배열의 중간에 요소 추가

const totalUsers = users.splice(1,0, 'Microft'); //1번 인덱스 자리에 'Microft' 추가
console.log(totalUsers); // [] => 빈배열 반환, 삭제된 요소 없음
console.log(users); // [ 'Charles', 'Microft', 'Cecilia', 'Den' ] => 변경된 배열 반환

배열의 중간에 한개 이상의 요소 추가

const totalUsers = users.splice(1,0, 'Microft','Merry'); //1번 인덱스부터 2개 요소 삭제
console.log(totalUsers); // [] => 빈배열 반환, 삭제된 요소 없음
console.log(users); // [ 'Charles', 'Microft', 'Merry', 'Cecilia', 'Den' ] => 1번 인덱스부터 'Microft','Merry' 추가됨.

배열 중간 요소 삭제 후 새로운 요소 추가

const totalUsers = users.splice(1,2, 'Microft'); //1번 인덱스부터 2개 요소 삭제
console.log(totalUsers); // [ 'Cecilia', 'Den' ] => 1,2인덱스 요소 삭제되어 반환
console.log(users); // [ 'Charles', 'Microft' ] => 1번인덱스 자리에 'Microft' 추가됨

slice()와 splice() 간단비교

slice()와 splice()와 비슷하게 생겨서(?) 헷갈리기도 하는데, 간단하게 비교해보자.

splice(start, deleteCount, addItem)

• start부터 deleteCount개 삭제한다.
• addItem을 추가한다.
• 원본 배열을 수정해서 반환한다.

slice(start, end)

• start부터 end까지 자른다.
• 원본 배열을 얕은 복사해서 새로운 배열로 반환한다.