Bu yazımızda esas olarak, javascript'te "for in" kullanımını inceleyeceğiz. Dizi içerisindeki verilere bir döngü içinde ulaşabilmemizi sağlayan bu yapıyı incelerken de JSON kullanımına kısaca değineceğiz
Daha önce XML kullanarak yaptığımız işlemleri, JSON (JavaScript Object Notation) kullanarak çok daha kolay ve hızlı bir şekilde yapmaya başladık. JSON'un javascript ve PHP ile kullanımı web tasarım dünyasında birçok kolaylık getirdi (Text özelliğinde olması, kurgusunun XML'e göre daha kolay ve az olması, eval fonksiyonu ile kullanılabilmesi, PHP encode ve decode fonksiyonları ile kolayca dizi veya nesneye çevrilebilmesi vb.). JSON ile ilgili ayrıntılı örnekler başka derslerin konuları olarak hazırlanacaktır.
Bu yazımızda basit bir JSON veri kullanarak, javascript döngü işlemi olarak "for in" olgusunun kullanımına değineceğiz. Bu yapı, web tasarım dili olarak php kullananların aşina olduğu "foreach" yapısına benzemektedir. Dizi içerisindeki "değişken"=>"değer" yapılarını bir döngü içerisinde sunmaktadır.
Syntax:
<script type="text/javascript">
for (degiskenIsmi in nesne){
//işlem
}
</script>
Aşağıdaki örnekle konuya giriş yapalım:
<script type="text/javascript">
var personel={firstName:"Dursun Ali", lastName:"Parayemez", department:"Muhasebe"};
for (x in personel){
document.write(personel[x]+" ");
}
</script>
Yukardaki kodun çıktısı aşağıdaki gibi olacaktır:
Hem JSON hem de "for in" olgusunu göstermek için, yukardaki kodlamamızda basit JSON veri gösterimi kullandık, fakat, "for in" aslında dizilerde kullandığımız bir döngü işlemidir, yani "for in" yapısını yukarda olduğu gibi dizi değerleri için de kullanabiliriz.
Aşağıdaki örnek normal dizi ile kullanımını göstermektedir:
<script type="text/javascript">
var personel =new Array();
personel['firstName']='Dursun';
personel['lastName']='Parayemez';
personel['department']='Muhasebe';
for (x in personel){
document.write(personel[x]+" ");
}
</script>
Yukardaki kodun çıktısı aşağıdaki gibi olacaktır:
Bu yapıyı, javascript'in içinde tanımlanmış(built-in) nesneler içinde kullanabiliriz:
<script type="text/javascript">
var value;
document.write("Screen Nesne Özellikleri:
");
for (value in screen)
{
document.write(value);
document.write(", ");
}
</script>
Yukardaki kodun çıktısı aşağıdaki gibi olacaktır:
Web tasarımlarınızda, son teknolojiyi takip etmek, yeniliklerden haberdar olmak, sisteminizin ve kendinizin gelişimi açısından çok önemlidir.
Kolay gelsin, görüşmek üzere...
