Öncelikle “dizi nedir” sorusuna cevap vererek başlayalım. Dizi benzer ifadelerin bir araya getirildiği özel değişkendir.
Bir değişken içinde bir veri saklana bilirken, dizilerde birden fazla veri saklamak mümkündür. Aşağıdaki örnek kod parçasının ilk satırında diller adında bir dizi oluşturulmuştur. İkinci satırda da idsi örnek olan etiket seçilmiş ve dizi içindeki değerler yerleştirilmiştir.
1 2 3 4 5 6 7 8 9 10 11 |
<div id="ornek"> </div> <script> var diller= ["CSS", "HTML", "JavaScript"]; document.getElementById("ornek").innerHTML = diller; </script> |
Eğer dizi kullanmasaydık yukarıdaki değerleri şu şekilde yazmak zorunda kalacaktık.
1 2 3 4 5 6 7 |
var dil1="CSS"; var dil2="HTML"; var dil3="JavaScript"; |
Javascript ile Dizi Nasıl Oluşturulur?
JS dizi oluşturmanın kuralı şu şekildedir.
1 2 3 |
var diziadi=["değer1","değer2","değer3",...]; |
Örnek kodda şu şekilde olacaktır.
1 2 3 |
var donanim=["Harddisk","İşlemci","Ram","Anakart"]; |
Ayrıca bilinmesi gereken bir konu da javascript ile veri tipleri dinamik olarak tanımlanır. Bu ifadeden yola çıkarak javascript dizisi içinde kullanılan verilerin tipleri bir birinden farklı olabilir. Şu şekilde dizi tanımlamakta mümkündür.
1 2 3 |
var ornek=["Ahmet",false,12,"Yazı",78.5]; |
Not:Sadece bu şekilde değil iç içe dizi ve dizi içinde nesne(diziler de bir nesnedir bu arada) tanımlamak da mümkü[highlight][/highlight]ndür.
New Anahtar Kelimesi ile Dizi Oluşturma
new anahtar kelimesi ile dizi oluşturmak içinde içinde şu şekilde kod yazmak gerekecektir.
1 2 3 |
var isimler=new Array("Ali","Ahmet","Yusuf"); |
Dizi Nesnelerine Nasıl Ulaşılır?
Dizi içindeki her bir değerinin bir adresi vardır. Dizilerdeki bu adreslere programcı olarak index adını verilmektedir.
İlk değerin index(adresi) 0. index olarak ifade edilir ve yine köşeli parantezler içinde index numaraları yazılarak değere ulaşılır.
1 2 3 |
dizi[index]; |
Örnek:
1 2 3 4 5 6 7 |
var diller= ["CSS", "HTML", "JavaScript"]; document.write( diller[0] );//ekrana CSS yazılacaktır. document.write(diller[1]);//ekrana HTML yazılacaktır. |
Dizi içindeki değer nasıl değiştirilir?
Dizi içindeki değeri değiştirmek içinde aynı yöntemle değer değiştirilir.
1 2 3 4 |
var diller= ["CSS", "HTML", "JavaScript"]; dizi[2]="Jquery"; |
[highlight]Javascript değerini jquery olarak değiştirdi.[/highlight]
JavaScriptte diziler nesne olarak tanımlanmıştır. typeof metodu ile dizinin tipini öğrenmek mümkündür.
Dizi içinde Nesne(Object),fonksiyon, başka bir dizi de eklemek mümkündür.
Dizilerde kullanılan bazı metodlar ve özellikler
lenght özelliği: dizinin uzunluğunu öğrenmek için kullanılır.
1 2 3 4 5 |
var diller = ["CSS", "HTML", "JavaScript"]; diller.length;//3 değerini verecektir. |
Diziye nesne ekleme:
1 2 3 4 |
var diller = ["CSS", "HTML", "JavaScript"]; diller.push("Jquery");//diziye jquery değerini ekler. |
lenght özelliği ile diziye değer eklemek için;
1 2 3 4 |
var diller = ["CSS", "HTML", "JavaScript"]; diller[diller.length]="Jquery";//index numarası 3 olan elemana <strong>Jquery</strong> değeri eklendi. |
Sırasız index numarası verip değer eklemek de mümkündür.
1 2 3 4 |
var diller = ["CSS", "HTML", "JavaScript"]; diller[15]="Jquery"; |
Dizi oluştururken dikkat edilmesi gerekenlar
1 2 3 4 |
var diller= new Array("CSS","JS","HTML"); var diller = ["CSS", "HTML", "JavaScript"];//Daha hızlı çalışır. |
new anahtar kelimesi ile tek değer yazılarak bir dizi oluşturulursa, girilen değer dizi boyutu kabul edilir. Yazılan sayı kadar undefined tipinde değer oluşturulur. Aşağıdaki örnekte içinde değer girilmemiş 12 elemanlı bir dizi oluşturulmuştur.
1 2 3 |
var aylar= new Array(12); |
Diziler ile daha fazla örnek için sitede dizi metodlarını araştırabilirsiniz.
[…] JavaScript Dizi Tanımlama […]
[…] ile dizideki eleman sayısını öğrenebiliriz. Aşağıdaki örnekte gunler adında bir dizi tanımlandı. gunler.length özelliği ile dizi sayısı öğrenilip döngüde dizinin her öğesi gunler[i] ile […]
[…] JavaScript Dersleri 11.1: Dizi Tanımlama […]
[…] oluşturma ve dizilerde kullanılan bazı metodları Dizi Oluşturma isimli makalede belirtmiştim. Bu makalede diziler üzerinde işlem yapan metodların nasıl […]