JavaScript'te Diziler (Array) - Zinzinzibidi

JavaScript'te Diziler (Array)

Değişkenler ve Veri Türleri dersinde diziler (array) konusuna kısaca değinmiştik. Birden fazla verinin saklanması için oluşturulan değişkenlere dizi adı verilir. Dizilerin oluşturulmasındaki temel düşünce birden fazla veriye tek bir değişken altından erişebilmektir.

Değişkenlerdeki her bir veriye eleman denir. Dizi elemanları indeks değerleri ile çağrılırlar. İndeks bir elemanın dizi içinde nerede yer aldığını gösterir.

İndeksler bir çok programlama dilinde olduğu gibi 0'dan başlar. 0'dan başlamasının sebebi programlama dillerinin tamamen insan mantığı oluşturulmuş olduğunun göstergesidir.

Dizide eleman tanımlamak için kullanılan üç yöntem vardır. İlkini sözünü ettiğim derste görmüştük.

<script> var sayilar = new Array("sıfır", "bir", "iki", "üç"); document.write(sayilar); </script>

Bu daha önce öğrendiğimiz yöntemdir. sayilar adında 4 elemanlı bir dizi oluşturduk.

sıfır,bir,iki,üç

Çıktımız ise bu şekilde olacaktır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar); </script>

Bu da ikinci yöntemdir. Dizi elemanlarını köşeli parantezler ([ ]) içerisine yazıyoruz.

sıfır,bir,iki,üç

Çıktımız ise aynı şekilde olacaktır.

<script> var sayilar = new Array(); sayilar[0] = "sıfır"; sayilar[1] = "bir"; sayilar[2] = "iki"; sayilar[3] = "üç"; document.write(sayilar); </script>

Son yöntemimizde ise sayilar adında boş bir dizi oluşturduk ve elemanlarını tek tek girdik.

sıfır,bir,iki,üç

Bu çıktımız da aynı olacaktır.

length özelliği: Bir dizinin eleman sayısını dilimizde uzunluk anlamına gelen length özelliği ile sorgulayabiliriz.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar.length); </script>

Bunun için dizi adindan sonra .length komutunu çalıştırmamız yeterlidir.

4

Çıktımız ise bu şekilde olacaktır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar[2]); </script>

İstenilen eleman değerine ulaşmak için indeks değerini sorgulamak yeterlidir.

iki

Çıktımız ise ikinci indeks değerini verecektir.

Dizi Elemanlarını Değiştirme

JavaScript'te dizi elemanları oldukça kolay bir şekilde değiştirilebililr.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; sayilar[2] = "iikii"; document.write(sayilar); </script>

Örneğin sayilar dizisindeki "iki" elemanını "iikii" olarak değiştirdik. Bunun için değiştirmek istediğimiz elemanın indeks değerini yazdıktan sonra yeni değeri atamamız yeterlidir.

Diziye Yeni Eleman Ekleme

JavaScript'te diziye yeni eleman eklemek de oldukça kolaydır.

push( ) metodu: push dilimizde ittirmek anlamına gelmektedir. JavaScript'te dizinin sonuna eleman eklemek için kullanılır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; sayilar.push("dört", "beş"); document.write(sayilar); </script>

Bu şekilde iki yeni eleman daha eklemiş olduk.

sıfır,bir,iki,üç,dört,beş

Çıktımız ise bu şekilde oldu.

unshift( ) metodu: Bu method JavaScript'te dizinin başına eleman eklemek için kullanılır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; sayilar.unshift("eksi üç", "eksi iki", "eksi bir"); document.write(sayilar); </script>

Negatif ifadeli sayılarımızı dizinin başına ekledik.

eksi üç,eksi iki,eksi bir,sıfır,bir,iki,üç

Çıktımız ise bu şekilde olacaktır.

Diziden Eleman Silme

splice( ) metodu: splice dilimizde iki ucu birbirine birleştirmek gibi bir anlama gelmektedir. JavaScript'te ise belirtilen index değerinden sonra silinecek eleman ya da elemanlar için kullanılır. splice metodunda replace'de olduğu iki parametre vardır. İlk parametre silinecek indeks konumunu, ikinci parametre ise indeksten sonra kaç adet elemanın silineceğini belirtir.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; sayilar.unshift("eksi üç", "eksi iki", "eksi bir"); sayilar.splice(0, 3); document.write(sayilar); </script>

Biraz karışık gibi gelmiş olabilir. Burada şunu yaptık: Negatif değerli sayıları ekledik ve daha sonra bu sayıları diziden çıkardık.

sıfır,bir,iki,üç

Çıktımız ise bu şekilde olacaktır.

pop( ) ve shift( ) metodları: pop metodu dizinin son elemanını, shift metodu ise dizinin ilk elemanını silmeye yarar.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; sayilar.pop(); sayilar.shift(); document.write(sayilar); </script>

sayilar dizimizin ilk ve son elemanları olan sıfır ve üç elemanlarını sildik.

bir,iki

Çıktımız bu şekilde olacaktır.

delete operatörü: Bu operatör ilgili elemanı listeden çıkartır ve yerine tanımsız bir eleman atar. Diğer bir ifade ile ilgili indekse ait elemanı tanımsız yapar.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; delete sayilar[1]; document.write(sayilar+""+sayilar.length);e(sayilar+""+sayilar.length); </script>

1 numaralı indeksi sildik. Fakat kaldırmadık. Yerine tanımsız bir değişken atandı. Bir alt satırdaki dizi boyutundan bunu anlayabilirsiniz.

sıfır,,iki,üç 4

Çıktımız ise bu şekilde olacaktır.

Diziden Eşzamanlı olarak Eleman Silme ve Ekleme

Yine splice( ) fonksiyonunu kullanıyoruz. Fakat bu sefer iki parametreden sonra sildiğimiz elemanların yerine gelecek elemanları yazıyoruz. splice( )'ı tam olarak anladıysanız bu işlem oldukça kolay gelecektir.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; sayilar.unshift("eksi üç", "eksi iki", "eksi bir"); sayilar.splice(0, 3, "zinzin", "zomzom", "zumzum"); document.write(sayilar); </script>

Bu sefer negatif ifadeleri sayıları sildik ve yerine "zinzin", "zomzom", "zumzum" değerlerini yazdırdık.

zinzin,zomzom,zumzum,sıfır,bir,iki,üç

Çıktımız ise bu şekilde olacaktır.

Dizilerin Birleştirilmesi

concat( ) metodu: Birden fazla diziyi birleştirmek için kullanılır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; var cinler = ["zinzin", "zomzom", "zepzep"]; var sayilar_ve_cinler = sayilar.concat(cinler); document.write(sayilar_ve_cinler); </script>

Burada sayilar ve cinler adında iki dizimiz var. sayilar_ve_cinler adında yeni bir dizi tanımlıyoruz ve iki dizimizi birleştiriyoruz.

sıfır,bir,iki,üç,zinzin,zomzom,zepzep

Çıktımız ise bu şekilde olacaktır.

Elemanların Sıralanması

sort( ) metodu: Dizi elemanlarını küçükten büyüğe göre sıralamak için kullanılır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar.sort()); </script>

Örneğimizde sort( ) metodu ile elemanlarımızı alfabetik sıraya göre sıraladık. Önemle belirteyim ki, elemanların indeks konumları da değişecektir.

bir,iki,sıfır,üç

Çıktımız ise bu şekilde olacaktır.

reverse( ) metodu: Dizi elemanlarını tersten sıralamak için kullanılır.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar.reverse()); </script>

Örneğimizde reverse( ) metodu ile elemanlarımızı tersten sıraladık.

üç,iki,bir,sıfır

Çıktımız ise bu şekilde olacaktır.

Dizide Değişken Aramak

indexof( ) metodu: Diyelim ki bir dizide çok fazla elemanımız var bir elemanı arıyoruz; fakat nerede olduğunu bulamıyoruz. Bunun için indexof( ) fonsiyonunu kullanıyoruz. Bu metod aranan elemanın indeks konumunu verir.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar.indexOf("iki")); </script>

Örneğimizde "iki" adlı elemanın nerede olduğunu sorgulattık.

2

Çıktımız ise bu şekilde indeks numarasını verecektir.

Elemanların Dönüşümü ve Metinsel İşlemler

Dönüşümü öğrenmeden önce bir dizi içerisindeki elemanların hangi veri türü olduğunu öğrenelim.

typeof ( ) metodu: Bu metod bir değişkenin ne tür bir veri türü olduğu hakkında bilgi verir.

<script> var sayilar = ["sıfır", "bir", "iki", "üç", 1, 2, 3]; document.write(typeof(sayilar[4])); </script>

Örneğimizde indeks değeri 4 olan "1" adlı elemanın ne tür bir veri olduğunu sorguladık.

number

"1" elemanının number veri türünde olduğunu öğrendik.

toString( ) metodu: Dizi içindeki tüm elemanları string veri türüne çevirir.

<script> var sayilar = ["sıfır", "bir", "iki", "üç", 1, 2, 3]; var sayilar = sayilar.toString(); document.write(typeof (sayilar[4])); </script>

Burada sayilar dizisindeki tüm elemanları string türüne çevirdik (convert ettik).

string

Dördüncü eleman olan "1"in ne tür olduğunu sorduğumuzda ise string yanıtını aldık.

join( ) metodu: Normalde çıktımızı yazdırırken elemanlar arasına varsayılan olarak virgül konulur. join ile dizi içindeki elemanların sıralama görünümünü değiştirebiliriz.

<script> var sayilar = ["sıfır", "bir", "iki", "üç"]; document.write(sayilar.join("-")); </script>

Elemanlar arasına - (tire) işaretinin konulmasını istedim.

sıfır-bir-iki-üç

Çıktımız ise bu şekilde olacaktır.

Bu dersin videosunu 1080p HD kalitesinde izleyebilirsiniz.

Oldukça uzun bir ders oldu sanırım. Bir sonraki dersimizde JavaScript'te koşullar ve döngüler konusuna değineceğiz.

Diğer derse geçmek için tıklayınız. >>>