[JavaScript] Array.prototype.splice()

 아래와 같은 문제를 받았다.

* 아래 내용을 구현하세요

 1. arr 배열의 start 인덱스부터 deleteCount만큼 요소를 제거한 뒤,
 2. 그 자리에 items를 삽입하세요.
 3. 반드시 splice 메서드를 사용해야 합니다.
 4. 원본 배열 arr를 직접 조작하고, 조작된 배열을 반환하세요.

 * @param {any[]} arr
 * @param {number} start
 * @param {number} deleteCount
 * @param  {...any} items
 * @returns {any[]} 조작 후의 arr

 

간단하지!

function removeAndInsert(arr, start, deleteCount, ...items) {
  return arr.splice(start,deleteCount,...items)
}

라고 생각했던 과거의 나.

 

테스트를 해본 결과 자꾸 빈배열이 반환됐다.

왜일까? 🤔

 

mdn문서를 확인해봤다.

splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다.

반환 값 :
제거한 요소를 담은 배열 하나의 요소만 제거한 경우 길이가 1인 배열을 반환합니다. 아무 값도 제거하지 않았으면 빈 배열을 반환합니다.

 

아!! 제거한 요소를 담아서 반환하는구나.

그치 기존 배열의 내용을 변경하니까, 내가 짠 코드는 제거한 요소가 담겨있겠다.

원하는 결과값을 얻으려면 기존의 배열을 반환해줘야하는구나.

 

function removeAndInsert(arr, start, deleteCount, ...items) {
 arr.splice(start,deleteCount,...items);
 return arr;
}

 코드를 수정하였더니 잘 동작하였다.

 

splice는

• 기존 배열의 값을 바꾼다.
• 삭제한 요소를 반환한다.

잘 기억해두자!