JavaScript의 배열에서 요소를 제거하는 방법은 무엇입니까?


340
var arr = [1,2,3,5,6];

첫 번째 요소 제거

배열의 첫 번째 요소를 제거하여 배열이되도록하고 싶습니다.

var arr = [2,3,5,6];

두 번째 요소 제거

이 질문을 확장하려면 배열의 두 번째 요소를 제거하여 배열이되도록하려면 어떻게해야합니까?

var arr = [1,3,5,6];

1
slice(start, end)하지 'how_many_to_remove'
seanjacob

2
@Ped arr.unshift ()는 제거되지 않지만 "배열의 시작 부분에 하나 이상의 요소를 추가합니다"
psycho brm

@seanjacob 그것은 내가 추측 splice하지 않습니다 slice.
Animesh Singh

답변:


346

보다 유연한 솔루션을 위해이 splice()기능을 사용하십시오 . 인덱스 값을 기준으로 배열의 모든 항목을 제거 할 수 있습니다.

var indexToRemove = 0;
var numberToRemove = 1;

arr.splice(indexToRemove, numberToRemove);

12
그리고 후속 질문 : arr.splice(1,1)두 번째 요소.
slebetman

1
내가 선호하는 splice()이상 shift()은 더 유연하기 때문이다. 미래에 다른 것을하고 싶을 수도 있으며 항상 하나의 요소 또는 첫 번째 요소 만 제거하고 싶지는 않습니다.
Gabriel McAdams

14
Google에서 여기 온 경우 : Gabriel은이 답변을 선호하지만 shift ()도 있음을 알고 있어야합니다. Joseph의 답변을 참조하십시오.
SHernandez

668

shift()당신의 상황에 이상적입니다. shift()배열에서 첫 번째 요소를 제거하고 해당 요소를 반환합니다. 이 방법은 배열의 길이를 변경합니다.

array = [1, 2, 3, 4, 5];

array.shift(); // 1

array // [2, 3, 4, 5]

이것은 작동하지만 배열의 첫 번째 요소 만 제거합니다.
Gabriel McAdams

53
@ 가브리엘 : 정확히 그 질문이 아니 었습니까? 나는 그것이 훨씬 명확하고 직접적이므로 선호 shift()합니다 splice(..., ...).
Bruno Reis

6
수정 : 그것은 당신이 제공 한 링크에 따라 새로운 배열에서 첫 번째 요소를 뺀 첫 번째 요소를 반환합니다 :)
DanH

코드 예제는 정확하지만 설명 은 오해의 소지가 있습니다. (a) @DanH가 지적한대로 반환 되는 첫 번째 요소 이며 (b) 입력 배열이 수정 되었다는 사실이 명확하지 않습니다. 따라서 Ped의 답변이 우수합니다.
mklement0

2
shift큰 목록을 연결하지 않으면 더 빠릅니다. jsperf.com/splice-vs-shift3jsperf.com/splice-vs-shift2
kcathode

61

Array.prototype.shift메소드는 배열에서 첫 번째 요소를 제거하고 리턴합니다. 원래 배열을 수정합니다.

var a = [1,2,3]
// [1,2,3]
a.shift()
// 1
a
//[2,3]

4
Joseph Silvashy의 답변이 크게 개선되었습니다. 설명과 코드가 일치하지 않습니다.
mklement0

48
arr.slice(begin[,end])

비파괴, 스플 라이스 및 시프트는 원래 배열을 수정합니다


3
비 변이에 대한 예. 더 잘 보입니다.
사용자

16

Javascript Arrays에서 임의의 위치에 요소를 삽입하고 삭제하는 방법에 대한 작은 기사를 작성했습니다.

다음은 위치에서 요소를 제거하는 작은 스 니펫입니다. Javascript에서 Array 클래스를 확장하고 remove (index) 메소드를 추가합니다.

// Remove element at the given index
Array.prototype.remove = function(index) {
    this.splice(index, 1);
}

예제에서 첫 번째 항목을 제거하려면 arr.remove ()를 호출하십시오.

var arr = [1,2,3,5,6];
arr.remove(0);

두 번째 항목을 제거하려면

arr.remove(1);

다음 은 Array 클래스에 대한 insert 및 delete 메소드 가 포함 된 작은 기사 입니다.

본질적으로 이것은 스플 라이스를 사용하는 다른 답변과 다르지 않지만 이름 splice은 직관적이지 않으며 응용 프로그램 전체에서 호출하면 코드를 읽기가 더 어려워집니다.



7

다른 답변은 훌륭 ES6합니다. 배열 기능으로 대체 솔루션을 추가하고 싶었습니다 filter.

filter() 기존 배열에서 주어진 기준에 해당하는 요소로 새 배열을 만듭니다.

따라서 기준을 통과하지 못하는 항목을 쉽게 제거 할 수 있습니다. 이 함수의 장점은 문자열과 숫자뿐만 아니라 복잡한 배열에서도 사용할 수 있다는 것입니다.

몇 가지 예 :

첫 번째 요소를 제거하십시오 .

// Not very useful but it works
function removeFirst(element, index) {
  return index > 0;
}
var arr = [1,2,3,5,6].filter(removeFirst); // [2,3,4,5,6]

두 번째 요소를 제거하십시오 .

function removeSecond(element, index) {
  return index != 1;
}
var arr = [1,2,3,5,6].filter(removeSecond); // [1,3,4,5,6]

홀수 요소 제거 :

function removeOdd(element, index) {
  return !(element % 2);
}
var arr = [1,2,3,5,6].filter(removeOdd); [2,4,6]

재고가없는 품목 제거

const inventory = [
  {name: 'Apple', qty: 2},
  {name: 'Banana', qty: 0},
  {name: 'Orange', qty: 5}
];

const res = inventory.find( product => product.qty > 0);


2

ES6 Destructuring Assignment 기능을 나머지 연산자와 함께 사용할 수 있습니다. 쉼표는 요소를 제거 할 위치와 나머지 (... arr) 연산자를 사용하여 배열의 나머지 요소를 제공합니다.

const source = [1,2,3,5,6];

function removeFirst(list) {
   var  [, ...arr] = list;
   return arr;
}
const arr = removeFirst(source);
console.log(arr); // [2, 3, 5, 6]
console.log(source); // [1, 2, 3, 5, 6]


1

Array.splice()첫 번째 요소를 제거하는 데 사용할 수없는 흥미로운 속성이 있습니다. 그래서 우리는

function removeAnElement( array, index ) {
    index--;

    if ( index === -1 ) {
        return array.shift();
    } else {
        return array.splice( index, 1 );
    }
}

3
Array.splice (0,1)은 첫 번째 요소를 제거합니다. 여기에있는 다른 모든 대답과 developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… 에 따르면 . 또한 왜 누군가가 첫 번째 요소를 제거하기 위해 -1을 전달합니까? 그들은 0을 통과하지 않습니까?
스톤

@skypecakes 0 번째 인덱스에서 스플 라이스의 타당성에 대해 말할 수는 없지만,이 검사 전에 인덱스가 감소하므로 전달 될 때 0이되었을 것입니다.
Jake T.

네, 첫 번째 요소를 확실히 제거 할 수 있습니다. 나는 그것을 여기에서 시험했다 : jsfiddle.net/sijpkes/d87rcLob/2
sijpkes 5

1

원래 배열을 변경하지 않는 Typescript 솔루션

function removeElementAtIndex<T>(input: T[], index: number) {
  return input.slice(0, index).concat(input.slice(index + 1));
}

1

배열에서 요소를 제거하는 방법에는 여러 가지가 있습니다. 아래에서 가장 많이 사용되는 옵션을 지적하겠습니다. 이 모든 옵션에서 무엇을 사용 해야하는지에 대한 적절한 이유를 찾을 수 없기 때문에이 답변을 작성하고 있습니다. 질문에 대한 답은 옵션 3 ( Splice () )입니다.

1) SHIFT ()-원래 배열에서 첫 번째 요소를 제거하고 첫 번째 요소를 반환

Array.prototype.shift ()에 대한 참조를 참조하십시오 . 첫 번째 요소를 제거하고 원래 배열을 변경해도 괜찮은 경우에만 사용하십시오.

const array1 = [1, 2, 3];

const firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1

2) SLICE ()-시작 색인과 종료 색인으로 구분 된 배열의 사본을 리턴합니다.

Array.prototype.slice ()에 대한 참조를 참조하십시오 . 이 옵션에서 특정 요소를 제거 할 수 없습니다. 기존 배열 만 슬라이스하고 배열의 연속 부분을 얻을 수 있습니다. 지정한 인덱스에서 배열을 자르는 것과 같습니다. 원래 배열은 영향을받지 않습니다.

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

3) SPLICE ()-특정 인덱스에서 요소를 제거하거나 교체하여 배열의 내용을 변경합니다.

Array.prototype.splice ()에 대한 참조를 참조하십시오 . splice () 메서드는 기존 요소를 제거 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다. 업데이트 된 배열을 반환합니다. 원래 배열이 업데이트됩니다.

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

0

reduce로도이를 수행 할 수 있습니다.

let arr = [1, 2, 3]

arr.reduce((xs, x, index) => {
        if (index == 0) {
            return xs
        } else {
            return xs.concat(x)
        }
    }, Array())

// Or if you like a oneliner
arr.reduce((xs, x, index) => index == 0 ? xs : xs.concat(x), Array())
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.