DeÄŸiÅŸkenler

Çoğu zaman JavaScript uygulamaları bilgi ile çalışır. Örnek vermek gerekirse:

1. Online Mağaza – satılacak ürün bilgileri.
2. Sohbet Uygulaması – Kullanıcı ve mesaj bilgisi.

Değişkenler bu bilgileri tutmak için kullanılırlar.

DeÄŸiÅŸken

Değişken “isimlendirilmiş hafıza” olarak adlandırılır. Değişkenler ile kullanıcıları, ürünleri ve diğer tipteki bilgileri tutabiliriz.

JavaScript dilinde deÄŸiÅŸken let kelimesiyle üretilir.

Aşağıdaki cümle “mesaj” isminde bir değişken üretir (diğer bir deyişle tanımlar):

let mesaj;

Artık bunun içerisine bilgi koyulabilir. Bunu atama operatörü ile = yapabilirsiniz.

let mesaj;

mesaj = 'Merhaba'; // Merhaba karakter dizisini mesaja atadınız

Artık karakter dizi değişken ile ilintili olan hafıza bölgesine kaydedildi. Artık değişken ismi kullanarak bu değere erişilebilir.

let mesaj;
mesaj = 'Hello!';

alert(mesaj); // değişkenin içeriğini gösterir.

Daha açıklayıcı olması açısından değişkeni aynı anda tanımlayıp değer atayabilirsiniz.

let mesaj = 'Merhaba!'; // Değişken tanımlandı ve değer atandı

alert(mesaj); // Merhaba!

Birden fazla değişkeni bir satırda tanımlamak da mümkündür.

let kullanici = 'Ahmet', yas = 25, mesaj = 'Merhaba';

Kısa görünse bile yukarıdaki yazım önerilmez. Okunabilirlik açısından her değişkenin bir ayrı bir satırda yazılması daha iyi olacaktır.

Tabi her değişken için ayrı satır kullanırsanız biraz uzun olur fakat okunması açısından daha kolaydır.

let kullanici = 'Ahmet';
let yas = 25;
let mesaj = 'Merhaba';

Bazı programcılar ise şu şekilde kullanmaktadırlar:

let kullanici = 'Ahmet',
  age = 25,
  mesaj = 'Merhaba';

Hatta bazıları şu şekilde kullanır:

let kullanici = 'Ahmet'
  , yas = 25
  , mesaj = 'Merhaba';

Teknik olarak bu yazımların hepsi doğrudur. Gerisi sizin yazım tarzınıza kalmış. Her yiğidin yoğurt yiyişi farklıdır.

var mesaj = 'Merhaba';

Gerçek hayat ile benzeşim

“Değişken” konsepti “kutu” olarak tanımlanabilir. Her kutunun üzerinde farklı bir etiket yapıştırılmıştır.

ÖrneÄŸin mesaj deÄŸiÅŸkeni üzerinde "mesaj" yazısı olan ve deÄŸeri "Merhaba!" olan bir kutu olarak hayal edilebilir.

Kutuya istediğiniz değeri koyabilirsiniz. Ayrıca içerisindeki değeri istediğiniz kadar değiştirebilirsiniz.

let mesaj;

mesaj = 'Merhaba!';

mesaj = 'Dünya!'; // değer değişti

alert(mesaj);

DeÄŸer deÄŸiÅŸtiÄŸinde, deÄŸiÅŸkenin eski deÄŸeri silinir.

Ayrıca iki değişken tanımlayıp içerilerindeki değerleri bir diğerine aktarabilirsiniz.

let merhaba = 'Merhaba Dünya!';

let mesaj;

// merhaba değişkeninin içeriğini mesaj değişkenine aktarın
mesaj = merhaba;

// artık iki değişken de aynı değeri taşır.
alert(merhaba); // Merhaba Dünya!
alert(mesaj); // Merhaba Dünya!

DeÄŸiÅŸken isimlendirme

JavaScript dilinde değişken oluştururken iki sınırlama vardır.

1. DeÄŸiÅŸken ismi sadece harfler, rakamlar, $ ve _ karakterlerinden oluÅŸabilir.
2. Ä°lk karakter rakam olamaz.

Geçerli birkaç örnek şu şekildedir:

let kullaniciAdi;
let test123;

Eğer isim birden fazla kelime kullanıyorsa deveHörgücü veya camelCase küçük harfle başlanıp her kelimenin baş harfi büyük olacak şekilde devam etme yöntemine deveHörgücü yöntemi denir. Bu yöntem yaygın bir şekilde kullanılır. Örneğin : benimUzunDegiskenim gibi.

'$' iÅŸareti ve '_' iÅŸareti de isimlerde harf gibi kullanılabilir. Farklı bir anlamı yoktur.

Aşağıdaki isimlendirmeler geçerlidir:

let $ = 1; //  "$" adında bir değişken üret ve değerini 1 yap.
let _ = 2; // "_" adında bir değişken üret ve değerini 2 yap.

alert($ + _); // 3

Geçersiz isimlendirmeler:

let 1a; // Rakam ile başlanılmaz.

let my-name; // isimlendirmede '-' karakteri kullanılamaz.

let имя = '...';
let 我 = '...';

let let = 5; // deÄŸiÅŸken ismi "let" verilemez, hata!
let return = 5; // deÄŸiÅŸken ismi return verilemez, hata!

// not: bu örnekte "use strict" kullanılmamıştır

num = 5; // eğer "num" değişkeni daha önce yaratılmadıysa yaratılır ve 5 değeri atanır.

alert(num); // 5

"use strict";

num = 5; // error: num tanımlanmadı.

Sabitler

Sabit(deÄŸiÅŸmeyen) tanımlamak için let yerine const kullanabilirsiniz.

const benimDogumGunum = '18.04.1982';

const ile tanımlanan deÄŸiÅŸkenler “constants” (Sabit) olarak tanımlanır. Bunlar deÄŸiÅŸtirilemezler, deÄŸiÅŸtirilmek istendiÄŸinde hata alınır:

const benimDogumGunum = '18.04.1982';

benimDogumGunum = '01.01.2001'; // hata, sabit'in deÄŸeri deÄŸiÅŸtirilemez!

Programcı deÄŸiÅŸkenin deÄŸerinin deÄŸiÅŸmeyeceÄŸine eminse const bunu garantiler. Ayrıca bu kodu kullanan herkese bunun garantilendiÄŸini bildirmiÅŸ olur.

Sabitlerin Büyük Harf İle İsimlendirilmesi

Genel kullanımda sabitler büyük harf ile isimlendirilirler. Eğer birden fazla kelimeden oluşuyorsa “_” ile bu kelimeleri ayırmak mümkündür.

Örneğin:

const RENK_KIRMIZI = "#F00";
const RENK_YESIL = "#0F0";
const RENK_MAVI = "#00F";
const RENK_TURUNCU = "#FF7F00";

// ...Resim seçmek istediğimizde
let renk = RENK_TURUNCU;
alert(renk); // #FF7F00

Yararları:

• RENK_TURUNCU "#FF7F00" a göre hatırlanması daha kolaydır.
• "#FF7F00" yazarken yanlış yazma olasılığı RENK_TURUNCU’ya göre yüksektir.
• Kodu okurken RENK_TURUNCU #FF7F00’dan daha fazla anlam ifade eder.

Sabitler için ne zaman büyük harf kullanılmalı ne zaman kullanılmamalı ?

“Sabit” değeri hiç değişmeyen demek. Fakat bazı değişkenler örneğin kırmızının hexadecimal karşılığı çalışmadan önce bilinirken bazıları çalışma zamanında hesaplanır fakat sonrasında değişmez.

Örneğin

const sayfaYuklenmeSuresi = /* Sayfanın yüklenme süresini tutar. */;

sayfaYuklenmeSuresi çalışmadan önce deÄŸeri bilinmeyen bir deÄŸerdir. Bundan dolayı normal isimlendirme kullanılır. Çalıştıktan sonra sadece bir defa tanımlanıp daha da deÄŸiÅŸmeyen bir deÄŸer olduÄŸundan hâlâ “sabit” denilebilir.

Diğer bir deyişle büyük harfle yazılan değişken isimleri sadece önceden bilinen değerleri tanımlamak için kullanılır.

Ä°simlendirmeyi doÄŸru yapmak

İsimlendirmeden konuşuyorsak düzgün isimlendirmeyi atlamamak gereklidir. Aslında en önemli konu da budur. Eğer değişken için isim bulamıyorsanız lütfen biraz daha düşünüp mantıklı bir isim bulun.

Proje daha karmaşıklaştıkça isimlendirmenin önemi daha da anlaşılır. Değişken isimlerine göre kodun yeni kodlamaya başlayan birisi tarafından mı yoksa tecrübeli birisi tarafından mı yazıldığını anlaşılabilir.

Çoğu projede zaman var olan kodların değiştirilmesi, bu kodlardan yeni fonksiyonlar yapılması üzerinedir. Yeni bir şey yapılacağında çoğunlukla eskisinin üzerine yapılır. Eski kodlara baktığınızda değişkenlere bakarak konuyu anlamak daha kolay olacaktır.

Lütfen değişkenleri isimlendirirken iyice düşünün sonrasında çok işinize yarayacak.

Birkaç kural şu şekildedir:

• Ä°nsan-okuyabilir deÄŸiÅŸken ismi verin kullaniciAdi veya alisverisSepeti gibi.

• a, b, c gibi kısaltmaları kullanmayın. Tabi ne yaptığınızı kesin olarak biliyorsanız kullanabilirsiniz.

• Ä°simlerin açıklayıcı olmasına önem verin. ÖrneÄŸin veri ve deger adindaki deÄŸiÅŸkenler bir ÅŸey ifade etmezler. Tabi eÄŸer kod bloÄŸunda bunların bir anlamı var ise kullanılabilir.

• Bazı tanımları kafanızda takımınızın kullandığı ÅŸekil ile uyumlu ÅŸekilde oturtun. ÖrneÄŸin siteyi ziyaret eden kiÅŸi kullanici ise kullanıcı ile olan deÄŸiÅŸkenleri anlikKullanici veya yeniKullanici gibi kullanın fakat yeniZiyaretci veya yeniCocuk gibi kullanmayın.

Basit değil mi? Gerçekten öyle, fakat pratikte bu kadar da basit değil. Umarım bunu siz gerçekleştirirsiniz.

Özet

Verileri saklamak için deÄŸiÅŸken tanımlayabilirsiniz. Bu iÅŸlemi var veya let veya const ile yapabilirsiniz.

• let – modern deÄŸiÅŸken tanımlama. Chrome üzerinde let ile deÄŸiÅŸken tanımlamak istiyorsanız sıkı modda (strict mode) çalışmanız gerekmekte.
• var – eski tip deÄŸiÅŸken tanımlama. Yeni kodlarda çok nadir kullanılır, belki yakında hiç kullanılmayacak. Bu konu ileride let ile var arasındaki nüans farkı Eski tip "var" bölümünde incelenecek.
• const – bu da let gibi fakat deÄŸeri deÄŸiÅŸtirilemez.

Değişkenler bulundukları yerdeki anlamlarına göre isimlendirilmelidirler.