Bir diziden ilk N öğeyi alma


383

Javascript (ES6) / FaceBook tepki ile çalışıyorum ve boyut olarak değişen bir dizinin ilk 3 elemanını almaya çalışıyorum. Linq take (n) eşdeğerini yapmak istiyorum.

Jsx dosyamda aşağıdakiler var:

var items = list.map(i => {
  return (
    <myview item={i} key={i.id} />
  );
});

Sonra denediğim ilk 3 ürünü almak için

  var map = new Map(list);
    map.size = 3;
    var items = map(i => {
      return (<SpotlightLandingGlobalInboxItem item={i} key={i.id} />);
    });

Haritanın ayarlanmış bir işlevi olmadığından bu çalışmadı.

Yardım edebilir misin lütfen?


4
Belki problemi yanlış anlıyorum, ama neden böyle bir şey kullanmıyorsunuz list.slice(0, 3);ve sonra tekrarlıyor musunuz?
Jesse Kernaghan

Haritayı neden kullanmak istiyorsunuz? Gereksiniminizi doğru anlarsam, ilk n öğeyi almak için dilimi kullanabilirsiniz.
Abhishek Jain

Öğretmen haritayı kullanmayı söylerse? :) Bu meşru bir soru ise özür dilerim, ama ödev gibi geldi.
diynevala

Lütfen halka daha yararlı olduğu kanıtlanan cevabı kabul edilen cevabı değiştirmeyi düşünün
Brian Webster

Yanıtlar:


401

Aradığın şeye inanıyorum:

// ...inside the render() function

var size = 3;
var items = list.slice(0, size).map(i => {
    return <myview item={i} key={i.id} />
}

return (
  <div>
    {items}
  </div>   
)


30

Bu şaşırtıcı olabilir, ancak lengthbir dizinin özelliği yalnızca dizi öğelerini almak için kullanılmaz, aynı zamanda yazılabilir ve dizinin uzunluğu MDN bağlantısını ayarlamak için kullanılabilir . Bu dizi değiştirir.

Geçerli diziye artık ihtiyaç duyulmuyorsa ve değişmezliği umursamıyorsanız veya bellek ayırmak istemiyorsanız, yani bir oyun için en hızlı yol

arr.length = n

bir diziyi boşaltmak

arr.length = 0

Bundan daha hızlı olduğuna emin misin arr = []?
GrayedFox

3
Buradaki fayda bellek ayırmadan kaçınmaktır. Oyunlar için i..e çalışma zamanında yeni nesneler başlatmak çöp toplayıcı ve önemsiz şey tetikliyor.
Pawel

Bu, dilimin sığ bir kopyayı döndüreceği diziyi değiştireceğini belirtmeye değer. Kalıcı olarak kestiğiniz öğeleri kullanmanız gerekiyorsa, bu büyük bir fark haline gelir.
Ynot

1
@Yapam, biraz daha açık hale getireceğim
Pawel

4
Bu, diziyi N'den daha küçükse de genişletir
Oldrich Svec

13

Bunu bir harita fonksiyonu kullanarak yapmayı denemeyin. Harita işlevi değerleri bir şeyden diğerine eşlemek için kullanılmalıdır. Giriş ve çıkış sayısı eşleştiğinde.

Bu durumda, dizide de bulunan filtre işlevini kullanın. Filtre işlevi, belirli ölçütleri işleyerek değerleri seçici olarak almak istediğinizde kullanılır. Sonra kodunuzu şöyle yazabilirsiniz:

var items = list
             .filter((i, index) => (index < 3))
             .map((i, index) => {
                   return (
                     <myview item={i} key={i.id} />
                   );
              });

1
Genel olarak haklısınız, ancak anlamsal olarak önce öğe kümesini filtrelemek için filtre kullanmalısınız , ardından bu yaklaşımı kullanıyorsanız filtrelenmiş kümeyi eşleyin.
Chris

8
Filtre işlevi dizideki tüm öğelerin içinden geçerken, dilim olmaz, bu nedenle dilim kullanmak daha iyi olur, değil mi?
elQueFaltaba

11

indexDizi kullanarak filtre uygulayabilirsiniz.

var months = ['Jan', 'March', 'April', 'June'];
months = months.filter((month,idx) => idx < 2)
console.log(months);


2
.filterkendi başına mükemmel bir seçim değildir, en azından giriş dizisi uzun olabilirse değil. .filterdurumunu kontrol eden dizinin her elemanından geçer. .slicebunu yapmaz, ancak ilk n öğeyi çıkarır ve sonra işlemeyi durdurur - bu kesinlikle uzun bir liste için istediğiniz şey olacaktır. (@ElQueFaltaba'nın başka bir cevaba yaptığı yorumlarda zaten söylediği gibi.)
MikeBeaton

9

Aşağıdakiler benim için çalıştı.

array.slice( where_to_start_deleting, array.length )

İşte bir örnek

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.slice(2, fruits.length);
//Banana,Orange  ->These first two we get as resultant

4
İlk örnekte slice, ikinci örnekte kullanırsınız splice.
Veslav

3
Bu da yanlış. Bundan alacaksın ["Apple", "Mango"]. Dilimin ilk bölümü "silmeye nereden başlanacağı" değil, dilimin nereden başlatılacağıdır. Orijinal diziyi değiştirmez ve hiçbir şeyi silmez.
Angel Joseph Piscola


0

Filtre Kullan

En iyi uygulama değil, başka bir yol

const cutArrByN = arr.filter((item, idx) => idx < n);

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.