JavaScript의 배열에서 항목을 제거하는 방법은 무엇입니까?

저는 Amit Shekhar , 개발자들이 고임금 기술직을 구하도록 돕는 멘토입니다.

이 블로그에서는 JavaScript에서 배열에서 항목을 제거하는 방법을 배웁니다. 사용 사례에 따라 JavaScript에서 배열에서 항목을 제거하는 방법은 여러 가지가 있으므로 사용할 방법을 결정할 수 있습니다.

이 문서는 원래 amitshekhar.me에 게시되었습니다.

다음의 메서드, 연산자 또는 속성을 사용하여 배열에서 항목을 제거할 수 있습니다.

splice() 방법

filter() 방법

delete 연산자

pop() 방법

shift() 방법

length 재산

예제를 통해 하나씩 학습해 봅시다.

splice() 메서드를 사용하여 항목 제거

JavaScript에서는 splice() 메서드를 사용하여 항목을 제거할 수 있습니다.

const arr = [1, 2, 3, 4, 5]
const removeItem = 4
const index = arr.indexOf(removeItem)
if (index > -1) {
  arr.splice(index, 1)
}
console.log(arr)
// [ 1, 2, 3, 5 ]

위의 예에서는 중복 항목이 없습니다. 중복 항목이 있는 또 다른 예를 들어 보겠습니다.

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
const index = arr.indexOf(removeItem)
if (index > -1) {
  arr.splice(index, 1)
}
console.log(arr)
// [ 1, 2, 3, 5, 4 ]

여기에서 중복 항목 사례가 처리되지 않는 것을 볼 수 있습니다. 중복 항목 사례를 처리하려면 배열을 반복해야 합니다.

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
for (let i = 0; i < arr.length; i++) {
  if (arr[i] === removeItem) {
    arr.splice(i, 1)
  }
}
console.log(arr)
// [ 1, 2, 3, 5 ]

이제 중복 항목 사례도 처리되고 있음을 알 수 있습니다.

직접 사용할 수 있는 유틸리티 함수를 만들 차례입니다.

function removeOneItem(arr, removeItem) {
  const index = arr.indexOf(removeItem)
  if (index > -1) {
    arr.splice(index, 1)
  }
  return arr
}

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
console.log(removeOneItem(arr, removeItem))
// [ 1, 2, 3, 5, 4 ]

function removeAllItems(arr, removeItem) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] === removeItem) {
      arr.splice(i, 1)
    }
  }
  return arr
}

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
console.log(removeAllItems(arr, removeItem))
// [ 1, 2, 3, 5 ]

이렇게 하면 이러한 유틸리티 기능removeOneItem 및 removeAllItems을 사용할 수 있습니다.

이렇게 하면 splice()를 사용하여 항목을 제거할 수 있습니다. 이제 filter() 방법으로 넘어 갑시다.

filter() 메서드를 사용하여 항목 제거

JavaScript에서는 filter() 메서드를 사용하여 항목을 제거할 수 있습니다.

let arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
arr = arr.filter((item) => item != removeItem)
console.log(arr)
// [ 1, 2, 3, 5 ]

filter 방법을 사용할 때 중복 항목 사례도 기본적으로 처리됩니다.

다음은 delete() 연산자입니다.

delete() 연산자를 사용하여 항목 제거

JavaScript에서는 delete() 연산자를 사용하여 항목을 제거할 수 있습니다.

const arr = [1, 2, 3, 4, 5]
const removeAtIndex = 3
delete arr[removeAtIndex]
console.log(arr)
// [1, 2, 3, empty, 5]

제거된 인덱스에 빈 항목이 있음을 확인하는 것이 중요합니다.

pop() 메서드를 사용하여 마지막 항목 제거

pop() 메서드를 사용하여 배열에서 마지막 항목을 제거할 수 있습니다.

const arr = [1, 2, 3, 4, 5]
arr.pop()
console.log(arr)
// [ 1, 2, 3, 4 ]

pop() 메서드를 사용하여 배열에서 마지막 항목을 제거하는 예입니다. 마찬가지로 shift() 메서드를 사용하여 배열 시작 부분에서 항목을 제거할 수 있습니다.

shift() 메서드를 사용하여 처음부터 항목을 제거합니다.

shift() 메서드를 사용하여 JavaScript에서 배열 시작 부분의 항목을 제거할 수 있습니다.

const arr = [1, 2, 3, 4, 5]
arr.shift()
console.log(arr)
// [ 2, 3, 4, 5 ]

shift() 메서드를 사용하여 배열의 시작 부분에서 항목을 제거하는 예입니다. 마지막은 length 속성입니다.

길이 속성을 사용하여 끝에서 항목 제거

JavaScript에서 length 속성을 사용하여 배열 끝에서 항목을 제거할 수 있습니다.

여기에서 항목 제거 후 남게 될 배열의 길이를 제공할 수 있습니다.

const arr = [1, 2, 3, 4, 5]
arr.length = 4
console.log(arr)
// [ 1, 2, 3, 4 ]

const arr = [1, 2, 3, 4, 5]
arr.length = 3
console.log(arr)
// [ 1, 2, 3 ]

그래서 JavaScript의 배열에서 항목을 제거하는 방법을 이해했습니다.

지금은 그게 다입니다.

감사

Amit Shekhar

다음에서 나와 연결할 수 있습니다.

GitHub

Facebook