Diziler, listeler ve map() fonksiyonu (Arrays, ListItems and map() )

map() fonksiyonu

map() yöntemi ile dizinin(array) içerisindeki her bir objeyi çağırarak yeni bir array oluşturur. 

Dizideki her bir element için fonksiyonu çalıştırır. 

Orjinal diziyi değiştirmez. 

Kullanım şeklini görmek için numerik bir dizi oluşturalım ve içerisindeki her bir numarayı iki katına çıkaralım. 

Aynı zamanda burada ki değerleri componenta göndererek <li> <ul> li kullanarak gösterebiliriz. 

Liste öğelerini gönderirken anahtar alanıda beraberinde göndermek gerekir. Kod çalışır ama f12 ile taracıyımızda incelediğimizde uyarı verdiğini görürüz.

Bu uyarıyı düzeltmek için map() fonksiyonunda <li> de değerimizi gönderirken aynı zamanda anahtar bir alanda göndererek çözelim. 

Anahtar(Key) 

Anahtarlar React'ın hangi ögelerin değiştiğini,eklendiğini yada silindiğini anlamasına yardımcıdır.

Dizilerin içerisindeki elemanlara düzgün bir kimlik verebilmek için anahtar değerler atanmalıdır. 

Anahtar değerini seçmek için öğeyi benzersiz olarak tanımlayabilecek bir değer seçmektir diğerlerinden ayrılmasını sağlamaktır. Genellik id ler kullanılır. Eğer düzenli bir id alanı yoksa o zaman index değeri kullanabiliriz. Ama anahtar olarak index alanını kullanmayı tercih etmemek gerekiyor çünkü diziler değişebilir buda performansı kötü olarak etkiler.