TypeScript'te bir dizi öğesini nasıl kaldırabilirim?


404

TypeScript'te oluşturduğum bir dizi var ve anahtar olarak kullandığım bir özelliği var. Bu anahtara sahipsem, bir öğeyi ondan nasıl kaldırabilirim?

Yanıtlar:


639

JavaScript'teki gibi.

delete myArray[key];

Bunun öğeyi olarak ayarladığını unutmayın undefined.

Array.prototype.spliceFonksiyonu kullanmak daha iyi :

const index = myArray.indexOf(key, 0);
if (index > -1) {
   myArray.splice(index, 1);
}

8
Buna bir tür ekleyebilirsiniz! var index: number = myArray.indexOf(key, 0);
CorayThan

17
@CorayThan Elbette dolaylı olarak bir indexOfdöner olarak yazılır numbermı?
Chris

5
@Chris Bu basit durumda açık olsa da, her değişken için açıkça bir tür tanımlarsanız hataları daha hızlı teşhis etmenize yardımcı olabilir. indexZaten birden fazla yerde kullanıyorsunuz ve bu yerlerden biri ( splice) bir numara görmek istiyor ya da bir hata alırsınız. Şu anda derleyici orada hata yapmanıza engel olamaz.
Jochem Kuijpers

33
@blorkfish, bir nesne listeniz varsa, kullanabileceğinizi belirtmek iyidir var index = myArray.findIndex(x => x.prop==key.prop);.
Francisco Cabral

6
@ Cirelli94 - daha eski bir iş parçacığına yanıt veriyorsunuz, ancak sorunuzun cevabı, bir dizi öğesinin silinmesinin uzunluğunu değiştirmediği veya diziyi yeniden endekslemediği. Diziler JavaScript nesneler olduğundan, delete myArr[2]tam anlamıyla siler özelliğini 2 ait myArrdaha da farklıdır, myArr[2] = undefined. Bu hikayenin ahlaki sadece splicebu görev için kullanmaktır , çünkü yan etkileri karıştırmadan istenen etkiyi elde etmek için güvenli bir yoldur.
winglerw28

200

Dizi nesne tipiyse, en basit yol

let foo_object // Item to remove
this.foo_objects = this.foo_objects.filter(obj => obj !== foo_object);

20
Bu, filtrelediği hiçbir şeyi kaldırmaz. Listenin gerçekten değiştirilmesi gerekiyorsa, bu yol değildir.
user573434

6
@ user573434 evet, adından da anlaşılacağı gibi haklısınız. Ancak başarılı bir şekilde silme api çağrısı vb. Bir nesneyi kaldırmak istediğinizde bu basit bir yaklaşımdır.
Malik Shahzad

3
Bu benim için benzersiz bir anahtar özelliği olmayan bir dizi nesne üzerinde mükemmel çalıştı. @ user573434, filtre yöntemi filtrelenmiş nesne olmadan yeni bir dizi döndürür, böylece elde edilen dizi nesnenin kaldırılmasına neden olur.
Jason

6
bir nesne olarak geri dönmek için bunu yapmak zorunda düşünüyorumthis.foo_objects = this.foo_objects.filter(obj => obj !== foo_object)[0];
Roel

1
Bu çalışıyor. 2. satırı dikkatlice okuyunuz. obj! = foo_object ile bir filtre yapar. ve bunu orijinal değişkene atar, böylece orijinal diziyi bir eksi filtrelenmiş foo_object ile değiştirir. kimliğine sahip bir dizi nesne ile birlikte kullandım deleteById(id: string) { this.data = this.data.filter(d => d.id !== id); }Sadece bir uyarı kelimesi, Ids benzersiz değilse, hepsini aynı şekilde kaldıracaksınızid
Markus

74

ES6 ile bu kodu kullanabilirsiniz:

removeDocument(doc){
   this.documents.forEach( (item, index) => {
     if(item === doc) this.documents.splice(index,1);
   });
}

1
Dizi referansını değiştirmeden ve belirli bir eşitlik algoritması uygulama imkanı ile kaldırmak için en iyi çözüm
Sid

1
En iyi cevap bulduk
Gvs Akhil

1
ES6 kullanıyorsanız en iyi cevap
Nathan Beck

2
Ayrıca şunu da kullanabilirsiniz: this.documents.forEach ((item, index, array) => {if (item === doc) array.splice (index, 1);}); Özellikle iç içe dizilerle çalışırken çok daha temiz olabilir.
CGundlach

20

Bunun için benim çözümüm:

onDelete(id: number) {
    this.service.delete(id).then(() => {
        let index = this.documents.findIndex(d => d.id === id); //find index in your array
        this.documents.splice(index, 1);//remove element from array
    });

    event.stopPropagation();
}

Bu çözümün güzel yanı, nesne eşitliği iki nesneyi eşit olarak tanımlayamasa bile işe yarayacağıdır.
Brad Johnson

18

spliceÖğeleri kaldırmak için bir dizideki yöntemi kullanabilirsiniz .

örneğin arr, şu ada sahip bir diziniz varsa aşağıdakileri kullanın:

arr.splice(2, 1);

böylece burada indeks 2 olan eleman başlangıç ​​noktası olacaktır ve 2 argümanı kaç elemanın silineceğini belirler.

Adındaki dizinin son öğesini silmek istiyorsanız arrbunu yapın:

arr.splice(arr.length-1, 1);

Bu, son öğe silindiğinde arr döndürecektir.

Misal:

var arr = ["orange", "mango", "banana", "sugar", "tea"];
arr.splice(arr.length-1, 1)
console.log(arr); // return ["orange", "mango", "banana", "sugar"]

1
Sadece FYI, ekleme yöntemi diziyi değiştirir (bu durumda son öğeyi kaldırır) ve dizinin kendisini değil, kaldırılan öğeleri döndürür.
CGundlach

2
Son elemanın kaldırılması aslında arr.splice (arr.length-1,1) olmalıdır.
Steve In CO

15

bölümleri let bir dizidir. Bu diziden bir öğe kaldırmak istiyorsunuz.

departments: string[] = [];

 removeDepartment(name: string): void {
    this.departments = this.departments.filter(item => item != name);
  }

8

İşte bir nesne dizisinden bir nesneye göre özelliği kaldırmak için basit bir astar.

delete this.items[this.items.findIndex(item => item.item_id == item_id)];

veya

this.items = this.items.filter(item => item.item_id !== item.item_id);

1
İlk çözümdeki sorun, silme öğesinin kaldırılmasıdır, ancak dizi boyutunun algılanmadan önceki ile aynı kalmasıdır. İkinci çözümde yeni bir nesnemiz olacak, bu yüzden spme bağımlılığımız varsa onu kaybediyoruz. Splice (en üstteki cevapta) bu etkiye sahip değildir.
Krystian

Bunu işaret ettiğiniz için teşekkürler. Sanırım kullanım durumumda bunu henüz keşfetmemiştim. İyi gözlemlendi :)
Jamie Armor

5

TypeScript forma operatörünü kullanarak yanıt (...)

// Your key
const key = 'two';

// Your array
const arr = [
    'one',
    'two',
    'three'
];

// Get either the index or -1
const index = arr.indexOf(key); // returns 0


// Despite a real index, or -1, use spread operator and Array.prototype.slice()    
const newArray = (index > -1) ? [
    ...arr.slice(0, index),
    ...arr.slice(index + 1)
] : arr;

5

Typcript kullanarak bir çözüm daha:

let updatedArray = [];
for (let el of this.oldArray) {
    if (el !== elementToRemove) {
        updated.push(el);
    }
}
this.oldArray = updated;

Bu sorulan sorunu çözse de, yeni bir dizinin oluşturulması ve orijinalin üzerinde döngü nedeniyle yürütülmesi pahalıdır. Büyük bir dizide bu tür bir işlem yapmak, mobil pillerde daha zor, uzun bekleme, önemsiz, vb. Gibi istenmeyen yan etkiler üretebilir
Jessy

1

Bir diziden belirli bir nesneyi kaldırmanız gerekiyorsa ve aşağıdakilerden emin olmak istiyorsanız bunu kullanın:

  • liste yeniden başlatılmadı
  • dizi uzunluğu düzgün şekilde güncellenir
    const objWithIdToRemove;
    const objIndex = this.objectsArray.findIndex(obj => obj.id === objWithIdToRemove);
    if (objIndex > -1) {
      this.objectsArray.splice(objIndex, 1);
    }

0

Sadece bir dizi için uzatma yöntemi eklemek istedim.

interface Array<T> {
      remove(element: T): Array<T>;
    }

    Array.prototype.remove = function (element) {
      const index = this.indexOf(element, 0);
      if (index > -1) {
        return this.splice(index, 1);
      }
      return this;
    };
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.