메소드 를 사용 하는 것과 반대로 배열 요소 에서 delete연산자 를 사용 하는 것의 차이점은 무엇입니까 ?Array.splice

예를 들면 다음과 같습니다.

myArray = ['a', 'b', 'c', 'd'];

delete myArray[1];
//  or
myArray.splice (1, 1);

객체로 할 수있는 것처럼 배열 요소를 삭제할 수 있는데 왜 접속 방법을 사용합니까?

delete객체 속성을 삭제하지만 배열을 다시 색인화하거나 길이를 업데이트하지 않습니다. 이렇게하면 정의되지 않은 것처럼 보입니다.

> myArray = ['a', 'b', 'c', 'd']
  ["a", "b", "c", "d"]
> delete myArray[0]
  true
> myArray[0]
  undefined

실제로 value로 설정되지 undefined않고 속성이 배열에서 제거되어 정의되지 않은 것처럼 보입니다 . Chrome 개발 도구를 사용 empty하면 어레이를 기록 할 때 인쇄하여 이러한 차이점을 명확하게 확인할 수 있습니다.

> myArray[0]
  undefined
> myArray
  [empty, "b", "c", "d"]

myArray.splice(start, deleteCount) 실제로 요소를 제거하고 배열을 다시 색인화하며 길이를 변경합니다.

> myArray = ['a', 'b', 'c', 'd']
  ["a", "b", "c", "d"]
> myArray.splice(0, 2)
  ["a", "b"]
> myArray
  ["c", "d"]

Array.remove () 메서드

jQuery를 만든 John Resig 는 Array.remove프로젝트에서 항상 사용 하는 매우 편리한 방법을 만들었습니다 .

// Array Remove - By John Resig (MIT Licensed)
Array.prototype.remove = function(from, to) {
  var rest = this.slice((to || from) + 1 || this.length);
  this.length = from < 0 ? this.length + from : from;
  return this.push.apply(this, rest);
};

다음은 사용 방법에 대한 몇 가지 예입니다.

// Remove the second item from the array
array.remove(1);
// Remove the second-to-last item from the array
array.remove(-2);
// Remove the second and third items from the array
array.remove(1,2);
// Remove the last and second-to-last items from the array
array.remove(-2,-1);

존의 웹 사이트

delete는 배열의 요소에서 객체 만 제거하므로 배열의 길이는 변경되지 않습니다. 스플 라이스는 객체를 제거하고 배열을 줄입니다.

다음 코드는 "a", "b", "undefined", "d"를 표시합니다.

myArray = ['a', 'b', 'c', 'd']; delete myArray[2];

for (var count = 0; count < myArray.length; count++) {
    alert(myArray[count]);
}

"a", "b", "d"가 표시되는 반면

myArray = ['a', 'b', 'c', 'd']; myArray.splice(2,1);

for (var count = 0; count < myArray.length; count++) {
    alert(myArray[count]);
}

배열에서 요소의 모든 발생을 제거하는 방법을 이해하려고 시도 하면서이 질문을 우연히 발견했습니다. 다음은 비교의 의 splice와 delete각을 제거하기위한 'c'으로부터 items배열.

var items = ['a', 'b', 'c', 'd', 'a', 'b', 'c', 'd'];

while (items.indexOf('c') !== -1) {
  items.splice(items.indexOf('c'), 1);
}

console.log(items); // ["a", "b", "d", "a", "b", "d"]

items = ['a', 'b', 'c', 'd', 'a', 'b', 'c', 'd'];

while (items.indexOf('c') !== -1) {
  delete items[items.indexOf('c')];
}

console.log(items); // ["a", "b", undefined, "d", "a", "b", undefined, "d"]
​

에서 코어 자바 스크립트 1.5 참조> 연산자> 특수 연산자> 삭제 운영자 :

배열 요소를 삭제해도 배열 길이는 영향을받지 않습니다. 예를 들어, a [3]을 삭제하면 a [4]는 여전히 a [4]이고 a [3]은 정의되지 않습니다. 이것은 배열의 마지막 요소를 삭제하더라도 유지됩니다 (delete a [a.length-1]).

splice 숫자 인덱스와 함께 작동합니다.

반면, delete인덱스의 다른 종류에 대해 사용될 수있다 ..

예:

delete myArray['text1'];

스플 라이스는 배열에서만 작동한다는 점도 언급 할 가치가 있습니다. (일관된 순서를 따르기 위해 객체 속성에 의존 할 수 없습니다.)

객체에서 키-값 쌍을 제거하려면 실제로 원하는 것이 delete입니다.

delete myObj.propName;     // , or:
delete myObj["propName"];  // Equivalent.

대 스플 라이스 삭제

배열에서 항목을 삭제할 때

var arr = [1,2,3,4]; delete arr[2]; //result [1, 2, 3:, 4]
console.log(arr)

접합 할 때

var arr = [1,2,3,4]; arr.splice(1,1); //result [1, 3, 4]
console.log(arr);

삭제 의 경우 요소는 삭제 되지만 색인은 비어 있습니다.

의 경우에하면서 접합 요소를 삭제하고 나머지 원소의 인덱스는 따라서 감소되고

위에서 여러 번 언급했듯이 사용 splice()하는 것이 완벽하게 맞는 것 같습니다. Mozilla 설명서 :

이 splice()방법은 기존 요소를 제거하거나 새 요소를 추가하여 배열의 내용을 변경합니다.

var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];

myFish.splice(2, 0, 'drum'); 
// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]

myFish.splice(2, 1); 
// myFish is ["angel", "clown", "mandarin", "sturgeon"]

통사론

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

매개 변수

스타트

배열 변경을 시작하는 인덱스입니다. 배열의 길이보다 큰 경우 실제 시작 색인은 배열의 길이로 설정됩니다. 음수이면 끝부터 많은 요소를 시작합니다.

deleteCount

제거 할 이전 배열 요소 수를 나타내는 정수입니다. deleteCount가 0이면 요소가 제거되지 않습니다. 이 경우 하나 이상의 새 요소를 지정해야합니다. deleteCount가 시작시 시작하여 배열에 남아있는 요소 수보다 크면 배열 끝을 통과하는 모든 요소가 삭제됩니다.

deleteCount를 생략하면 deleteCount는 (arr.length - start).

item1, item2, ...

시작 색인에서 시작하여 배열에 추가 할 요소입니다. 요소를 지정하지 않으면 splice()배열에서 요소 만 제거됩니다.

반환 값

삭제 된 요소를 포함하는 배열입니다. 하나의 요소 만 제거하면 하나의 요소 배열이 반환됩니다. 요소가 제거되지 않으면 빈 배열이 반환됩니다.

[...]

delete 는 실제 상황이 아닌 것처럼 작동 하지만 항목 만 제거 하지만 배열 길이는 동일하게 유지됩니다.

노드 터미널의 예 :

> var arr = ["a","b","c","d"];
> delete arr[2]
true
> arr
[ 'a', 'b', , 'd', 'e' ]

다음은 slice ()를 사용하여 인덱스로 배열의 항목을 제거하는 함수입니다 . arr을 첫 번째 인수로 사용하고 삭제하려는 멤버의 인덱스를 두 번째 인수로 사용합니다. 보시다시피 실제로 배열의 멤버를 삭제하고 배열 길이를 1 줄입니다.

function(arr,arrIndex){
    return arr.slice(0,arrIndex).concat(arr.slice(arrIndex + 1));
}

위의 함수는 모든 멤버를 인덱스까지 가져오고 index 뒤의 모든 멤버를 가져와 함께 연결하여 결과를 반환합니다.

다음은 위의 기능을 노드 모듈로 사용하는 예입니다. 터미널이 유용하다는 것을 알 수 있습니다.

> var arr = ["a","b","c","d"]
> arr
[ 'a', 'b', 'c', 'd' ]
> arr.length
4 
> var arrayRemoveIndex = require("./lib/array_remove_index");
> var newArray = arrayRemoveIndex(arr,arr.indexOf('c'))
> newArray
[ 'a', 'b', 'd' ] // c ya later
> newArray.length
3

indexOf ( "c")는 첫 번째 발생 만 가져 오며 찾은 첫 번째 "c"만 분리하고 제거하기 때문에 두 개의 배열이있는 배열은 작동하지 않습니다.

큰 배열을 반복하고 요소를 선택적으로 삭제하려면 splice ()가 매번 후속 요소를 다시 인덱싱해야하므로 모든 삭제마다 splice ()를 호출하는 것이 비용이 많이 듭니다. 배열은 Javascript와 연관되어 있기 때문에 개별 요소를 삭제 한 다음 나중에 배열을 다시 색인화하는 것이 더 효율적입니다.

새로운 배열을 만들어서 할 수 있습니다. 예 :

function reindexArray( array )
{
       var result = [];
        for( var key in array )
                result.push( array[key] );
        return result;
};

그러나 원래 배열의 키 값을 더 효율적으로 수정할 수 있다고 생각하지 않습니다. 새 배열을 만들어야 할 수도 있습니다.

"정의되지 않은"항목은 실제로 존재하지 않으며 for 루프는이를 반환하지 않으므로 확인할 필요가 없습니다. 그것들은 정의되지 않은 것으로 표시하는 배열 인쇄의 인공물입니다. 메모리에 존재하지 않는 것 같습니다.

더 빠른 slice ()와 같은 것을 사용할 수 있다면 좋을 것이지만 다시 색인화하지는 않습니다. 더 나은 방법을 아는 사람이 있습니까?

실제로 다음과 같이 더 효율적이고 성능면에서이를 수행 할 수 있습니다.

reindexArray : function( array )
{
    var index = 0;                          // The index where the element should be
    for( var key in array )                 // Iterate the array
    {
        if( parseInt( key ) !== index )     // If the element is out of sequence
        {
            array[index] = array[key];      // Move it to the correct, earlier position in the array
            ++index;                        // Update the index
        }
    }

    array.splice( index );  // Remove any remaining elements (These will be duplicates of earlier items)
},

이 같은 것을 사용할 수 있습니다

var my_array = [1,2,3,4,5,6];
delete my_array[4];
console.log(my_array.filter(function(a){return typeof a !== 'undefined';})); // [1,2,3,4,6]

왜 필터링하지 않습니까? js의 배열을 고려하는 가장 명확한 방법이라고 생각합니다.

myArray = myArray.filter(function(item){
    return item.anProperty != whoShouldBeDeleted
});

delete연산자와 splice()메소드가 적용된 후 각 배열의 길이를 기록하면 차이를 알 수 있습니다 . 예를 들면 다음과 같습니다.

연산자 삭제

var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple'];
delete trees[3];

console.log(trees); // ["redwood", "bay", "cedar", empty, "maple"]
console.log(trees.length); // 5

delete연산자는 배열의 요소를 제거하지만, 소자의 "자리"는 여전히 존재한다.oak제거되었지만 여전히 배열의 공간을 차지합니다. 이 때문에 배열의 길이는 5로 유지됩니다.

splice () 메소드

var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple'];
trees.splice(3,1);

console.log(trees); // ["redwood", "bay", "cedar", "maple"]
console.log(trees.length); // 4

이 splice()방법은 목표 값 과 "자리 표시 자"도 완전히 제거합니다 . oak어레이에서 차지했던 공간뿐만 아니라 제거되었습니다. 배열의 길이는 이제 4입니다.

function remove_array_value(array, value) {
    var index = array.indexOf(value);
    if (index >= 0) {
        array.splice(index, 1);
        reindex_array(array);
    }
}
function reindex_array(array) {
   var result = [];
    for (var key in array) {
        result.push(array[key]);
    }
    return result;
}

예:

var example_arr = ['apple', 'banana', 'lemon'];   // length = 3
remove_array_value(example_arr, 'banana');

바나나가 삭제되고 배열 길이 = 2

그것들은 다른 목적을 가진 다른 것들입니다.

splice삭제에 사용되는 배열과 관련된다, 어레이로부터 엔트리 제거 와 갭을 채우기 위해 이전의 모든 이동을 항목. (항목을 삽입하거나 동시에 둘 다 삽입하는데도 사용할 수 있습니다.) 배열의 배열을 splice변경합니다 length(no-op 호출이 아니라고 가정 함 :) theArray.splice(x, 0).

delete배열별로 다릅니다. 객체에 사용하도록 설계되었습니다. 사용하는 객체에서 속성 (키 / 값 쌍)을 제거합니다. JavaScript의 표준 (예 : 유형화되지 않은) 배열은 실제로 배열이 아니기 때문에 배열에만 적용됩니다. * 이름이 "배열 인덱스"인 속성과 같은 특정 속성을 특수하게 처리하는 객체입니다. 문자열 이름 "... 누구의 숫자 값 이 범위 내에 있습니다 " 와로 정의 됩니다 . 배열 항목을 제거하는 데 사용 하면 항목을 제거하기 만하면됩니다. 간격을 메우기 위해 그 다음에 다른 항목을 이동시키지 않으므로 배열이 "희소"됩니다 (일부 항목이 완전히 누락 됨). 에 영향을 미치지 않습니다 .i+0 ≤ i < 2^32-1lengthdeletelength

이 질문에 대한 현재 답변 중 몇 개는 delete" 을 사용 하여 항목을 undefined"으로 설정 했다고 잘못 설명 되어 있습니다. 맞지 않습니다. 그것은 항목 (재산)을 완전히 제거 하고 간격을 남깁니다.

차이점을 설명하기 위해 몇 가지 코드를 사용하겠습니다.

console.log("Using `splice`:");
var a = ["a", "b", "c", "d", "e"];
console.log(a.length);            // 5
a.splice(0, 1);
console.log(a.length);            // 4
console.log(a[0]);                // "b"

console.log("Using `delete`");
var a = ["a", "b", "c", "d", "e"];
console.log(a.length);            // 5
delete a[0];
console.log(a.length);            // still 5
console.log(a[0]);                // undefined
console.log("0" in a);            // false
console.log(a.hasOwnProperty(0)); // false

console.log("Setting to `undefined`");
var a = ["a", "b", "c", "d", "e"];
console.log(a.length);            // 5
a[0] = undefined;
console.log(a.length);            // still 5
console.log(a[0]);                // undefined
console.log("0" in a);            // true
console.log(a.hasOwnProperty(0)); // true

* (내 빈혈 블로그에 게시 된 게시물)

현재 두 가지 방법이 있습니다

1. splice () 사용

   arrayObject.splice(index, 1);

2. 삭제를 사용하여

   delete arrayObject[index];

그러나 삭제는 배열 길이를 업데이트하지 않기 때문에 항상 배열 객체에 스플 라이스를 사용하고 객체 속성에 대해 삭제하는 것이 좋습니다.

자, 아래 배열이 있다고 상상해보십시오.

const arr = [1, 2, 3, 4, 5];

먼저 삭제합시다 :

delete arr[1];

결과는 다음과 같습니다.

[1, empty, 3, 4, 5];

빈! 그리고 그것을 얻자 :

arr[1]; //undefined

따라서 값이 삭제되고 현재 정의되지 않았 으므로 길이는 동일하며 true 를 반환 합니다 .

이번에는 배열을 재설정하고 스플 라이스로 수행하겠습니다 :

arr.splice(1, 1);

그리고 이것은 이번 결과입니다.

[1, 3, 4, 5];

보시다시피 배열의 길이는 변화하고 arr[1]있다 3 지금 ...

또한이 경우 삭제 된 항목을 Array에 반환합니다 [3].

다른 사람들은 이미 delete와 제대로 비교 했습니다 splice.

또 다른 흥미로운 비교는 delete대 undefined삭제 된 배열 항목 단지로 설정보다 적은 메모리를 사용합니다 undefined;

예를 들어이 코드는 완료되지 않습니다.

let y = 1;
let ary = [];
console.log("Fatal Error Coming Soon");
while (y < 4294967295)
{
    ary.push(y);
    ary[y] = undefined;
    y += 1;
}
console(ary.length);

이 오류가 발생합니다.

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory.

보시다시피 undefined 다시피 실제로 힙 메모리를 차지합니다.

그러나 deleteary-item도 (로 설정하는 대신 undefined) 경우 코드는 천천히 끝납니다.

let x = 1;
let ary = [];
console.log("This will take a while, but it will eventually finish successfully.");
while (x < 4294967295)
{
    ary.push(x);
    ary[x] = undefined;
    delete ary[x];
    x += 1;
}
console.log(`Success, array-length: ${ary.length}.`);

이것들은 극단적 인 예이지만, delete어느 누구도 언급하지 않은 것을 지적합니다.

작은 배열이 있으면 다음을 사용할 수 있습니다 filter.

myArray = ['a', 'b', 'c', 'd'];
myArray = myArray.filter(x => x !== 'b');

가장 쉬운 방법은 아마

var myArray = ['a', 'b', 'c', 'd'];
delete myArray[1]; // ['a', undefined, 'c', 'd']. Then use lodash compact method to remove false, null, 0, "", undefined and NaN
myArray = _.compact(myArray); ['a', 'c', 'd'];

도움이 되었기를 바랍니다. 참조 : https://lodash.com/docs#compact

Lodash 를 사용하려는 사람들은 다음을 사용할 수 있습니다. myArray = _.without(myArray, itemToRemove)

또는 Angular2에서 사용할 때

import { without } from 'lodash';
...
myArray = without(myArray, itemToRemove);
...

delete : delete는 객체 속성을 삭제하지만 배열을 다시 색인화하거나 길이를 업데이트하지는 않습니다. 이렇게하면 정의되지 않은 것처럼 보입니다.

splice : 실제로 요소를 제거하고 배열을 다시 색인화하며 길이를 변경합니다.

마지막에서 요소 삭제

arrName.pop();

처음부터 요소 삭제

arrName.shift();

중간에서 삭제

arrName.splice(starting index,number of element you wnt to delete);

Ex: arrName.splice(1,1);

마지막에서 하나의 요소 삭제

arrName.splice(-1);

배열 인덱스 번호를 사용하여 삭제

 delete arrName[1];

삭제할 요소가 중간에 있으면 (예 : 색인이 1 인 'c'를 삭제하려는 경우) 다음을 사용할 수 있습니다.

var arr = ['a','b','c'];
var indexToDelete = 1;
var newArray = arr.slice(0,indexToDelete).combine(arr.slice(indexToDelete+1, arr.length))

IndexOf참조 유형도 허용합니다. 다음 시나리오를 가정하십시오.

var arr = [{item: 1}, {item: 2}, {item: 3}];
var found = find(2, 3); //pseudo code: will return [{item: 2}, {item:3}]
var l = found.length;

while(l--) {
   var index = arr.indexOf(found[l])
      arr.splice(index, 1);
   }
   
console.log(arr.length); //1

다르게:

var item2 = findUnique(2); //will return {item: 2}
var l = arr.length;
var found = false;
  while(!found && l--) {
  found = arr[l] === item2;
}

console.log(l, arr[l]);// l is index, arr[l] is the item you look for

function deleteFromArray(array, indexToDelete){
  var remain = new Array();
  for(var i in array){
    if(array[i] == indexToDelete){
      continue;
    }
    remain.push(array[i]);
  }
  return remain;
}

myArray = ['a', 'b', 'c', 'd'];
deleteFromArray(myArray , 0);

// 결과 : myArray = [ 'b', 'c', 'd'];