Merhaba arkadaşlar bu yazıda JavaScript'de değişkenlere değineceğiz.
Yazıda:
- Değişken tanımlama yöntemlerine.
- Veri tiplerine.
- Değişken tanımlanmasına.
- Aynı değişkenin tekrar tanımlanması yani re-declaring işlemine.
$
ve_
işaretlerinin kullanımına.- Block scope kavramına.
- Hoist kavramına.
Değineceğim.
İyi okumalar dilerim.
Değişkenler veri depolamak için kullanılır . Bu kısımda değişken tanımlama yöntemlerini inceleyeceğiz.
JavaScript'de bir değişken 4 yöntemle tanımlanabilir:
-
Otomatik olarak.
-
var
keyword'u kullanarak. -
let
keyword'u kullanarak. -
const
keyword'u kullanarak.
Otomatik olarak tanımlanan değişkenlerin başında bir keyword bulunmaz. Dolayısıyla bir değişkenin otomatik olarak tanımlandığını bu şekilde anlarız. Otomatik olarak tanımlanan değişkenler matematiksel işlemlerde de kullanılabilirler.
Örnek
%%javascript
x = 4;
y = 5;
c = x + y;
// Konsola 9 rakamı yazdırılır.
console.log(c);
💡 Değişkenleri daima JavaScript dokümanının veya bulunduğu scope'un1 başında tanımlamak olası problemlerin önüne geçecektir. Buna JavaScript Hoist başlığı altında değineceğim.
💡 1995-2015 arasında değişken tanımlamak için var
keyword'u kullanılırdı, 2015'de değişken tanımlamak için JavaScript'e ek olarak let
ve const
keyword'leri de eklenmiştir. Böylece bir dokümanın içeriğine bakarak modern veya eski tarayıcılar için hazırlandığını anlayabiliriz.
Değişkenler dokümanın veya bulunduğu scope'un başında tanımlanmalıdır. Genel olarak değişken oluştururken aşağıdaki sıralamanın izlenmesi tavsiye edilir:
-
Otomatik değişken kullanılmaması tavsiye edilir.
-
Eğer bir değişkenin içeriği sabitse yani değişmeyecekse daima
const
keyword'u kullanılarak tanımlanması tavsiye edilir. -
Array ve object türündeki değişkenlerin içeriği sabitse yani değişmeyecekse daima
const
keyword'u kullanılarak tanımlanması tavsiye edilir. -
const
keyword'nun kullanılamadığı durumlardalet
keyword'u kullanılarak değişken tanımlanması tavsiye edilir. -
Şayet eski browser'lar için script yazacak isek
var
keyword'unun kullanılması tavsiye edilir.
Diğer programlama dillerinde olduğu gibi JavaScript'de de bir çok veri tipi bulunmaktadır. Veri tiplerine örnek verirsek string'ler ve numerik değerler JavaScript içerisinde en fazla kullanılan veri tipleridir. Şimdilik ihtiyacımız kadarına değiniyorum.
""
veya ''
işaretleri arasında kullanılırlar. Bir sayısal ifade ""
veya ''
işaretleri arasında kullanılıyorsa bu onun numerik string olarak ifade edildiğini gösterir.
Örnek
%%javascript
// str1 string özellikli bir değişkendir.
var str1 = "Test";
// str2 numerik string özellikli bir değişkendir.
var str2 = "4";
// str3 numerik string özellikli bir değişkendir.
var str3 = `3`;
// str3 numerik özellikli bir değişkendir.
var str4 = 4;
// str4 string özellikli bir değişkendir.
var str4 = `Text`;
JavaScript'de expression'lar (ifadeler) soldan sağa şekilde değerlendirilir. Yani Javascript ifadenin nerede string olacağını bu pattern'e göre belirler.
Örnek
%%javascript
// Konsola 71 yazdırılacaktır.
var x = 4 + 3 + "1";
console.log(x)
// Konsola 143 yazdırılacaktır.
var y = "1" + 4 + 3;
console.log(y)
// Konsola 8 yazdırılacaktır.
y = "9" - 4 + 3;
console.log(y)
Matematiksel operatörlerden +
işareti string veri tiplerinde kullanılabilir. Bu durumda string'ler birbirine eklenir. String veri tipleri için +
işareti ekleme operatörü olarak isimlendirilir.
Örnek
%%javascript
let x = "Emin" + " " + "Altan";
// Konsola "Emin Altan" ifadesi yazdırılır.
console.log(x);
Bir değişken oluşturulma işlemine JavaScript'de declaration adı verilir. Değişken deklarasyonu yapılırken en çok const
ve let
keyword'lerinden faydalanılır.
Bir değişken içeriğine değer atanmadan deklarasyonu yapılabilir. Bu durumdaki değişkenin içeriği undefined
olarak belirlenir. Bu durum const
ile tanımlanan değişken için geçerli değildir. const
keyword'u kullanılarak deklarasyonu yapılacak olan değişkene aynı satırda değer atanması şarttır.
💡 undefined
aynı zamanda bir keyword olup özellikle conditional statement'lar2 oluştururken bazen faydalı olabilir.
Örnek
%%javascript
// x değişkenine değer atamadan oluşturduk bu durumdaki değişken içeriği undefined olarak belirlenir.
var x;
// ❌ const keyword'u kullanılarak tanımlanan değişkenin bu şeklide kullanımı uygun değildir.
const firstName;
firstName ="Murat";
// ✔️ const keyword'u ile gerçekleştirilen deklarasyon tek satırda tanımlanmış olmalıdır.
const firstName2="Sinan";
💡 Aynı tipteki değişkenleri tek bir satırda tanımlayabiliriz, bu bize zamandan kazandırır. Bu durumda değişkenler arasına ,
işareti yerleştirilir.
Örnek
%%javascript
let name = "Emin", surname = "Altan", id = 500;
❗ JavaScript'de değişken isimleri aslında referans işlevi görür. Yani bir değerin ifade edilmesi için referans olarak kullanılırlar. const
keyword'unu bu perspektiften incelediğimizde aslında sabit bir değişken tanımlamak için değil sabit bir değer için referans oluşturmak amacıyla kullanılır. Bu ayrımın anlaşılması object ve array türündeki verilerin const
keyword'u ile birlikte kullanılması açısından önemlidir. Bunu bir örnek ile inceleyelim. Yazımın ilerleyen dönemlerinde array ve object türlerine değineceğim.
Örnek
%%javascript
// Array türünde değerlerimizi const ile tanımlanmış cities adında değişkene depoluyoruz.
const cities = ["Bursa", "İzmir", "Ankara"];
// cities array türündeki verinin ilk elementini (yani Bursa) değerini konsola yazdırıyoruz.
console.log(cities[0]);
// cities array türündeki verinin ilk elementini (yani Bursa) yeni bir değer ile yer değiştiriyoruz.
cities[0] = "İstanbul";
// cities referansının ilk değerini konsola yazdırıyoruz. Bu durumda ilk değer Bursa değil, İstanbul olacaktır.
console.log(cities[0]);
// ❌ cities referansına yeni bir değer atayamayız.
cities = ["Tekirdağ", "Samsun", "Sinop"];
JavaScript'de bir değişken var
keyword'u ile tekrar tanımlanabilir. Bu işleme re-declaring adı verilir. Bu durumdaki değişkene yeni veri atanmadığı sürece depolanmış verisini korur.
Örnek
%%javascript
var firstName = "Emin";
/**
* firstName değişken deklarasyonu tekrarlanmış. firstName değişkenine yeni bir değer atanmadığı sürece
* depoladığı bilgiyi koruyacaktır.
*/
var firstName;
/* Konsola "Emin" ifadesini yazdırır. */
console.log(firstName);
firstName = "Murat";
// firstName değişkeninin yeni değeri Murat olacak ve konsola "Murat" ifadesi yazdırılacaktır.
console.log(firstName);
let
ve const
ile tanımlanmış bir değişken tekrar tanımlanamaz. Bir değişkenin tekrar tanımlanabilme özelliği sadece var
keyword'u için geçerlidir.
💡 Genelde $
simgesi değişken tanımlamak için kullanılmaz. Bir javascript kütüphanesi içerisindeki metoda alias3 vermek için kullanılır. Mesela $
işareti JQuery kütüphanesindeki tüm <a>
elementlerini seçmek için kullanılabilir. $("a")
gibi.
💡 Genelde JavaScript'de _
(underscore) işareti bir değişkenin private olduğunu ifade etmek için kullanılır.
2015'den (ES6) önce JavaScript'de 2 tür scope kavramı bulunmaktaydı bunlar global scope4 ve function scope5 kavramları idi. ES6 ile let
ve const
keyword'leri JavaScript'e entegre olmuştur. Bu keyword'ler kullanılarak oluşturulan bir değişken bulunduğu scope dışından erişilemez ve kullanılamaz. Bu ifade block scope kavramını oluşturur.
var
keyword'una bulunduğu scope dışından erişilebilir ve kullanılabilir.
Örnek
%%javascript
{
let x = 5;
var y = 10;
}
// x değişkenine erişilemez ve kullanılamaz. Konsola "ReferenceError: x is not defined" ifadesi yazdırılır.
console.log(x);
// y değişkenine erişilebilir ve kullanılabilir. Konsola 10 rakamı yazdırılır.
console.log(y);
Bazen bir değişkene değer atar sonrasında tanımlarız. Bu durumda JavaScript değişkeni bulunduğu scope içerisinde en üst satıra taşıyacak ve kodları çalıştıracaktır. Kısaca buna hoist adı verilir. Hoist (kaldırma) kelimesinin anlamından ne işe yaradığını aklınızda tutabilirsiniz.
var
keyword'u ile tanımlanan değişkenler için tam anlamıyla çalışır. let
ve const
ile tanımlanan bir değişken hoist edilir fakat initialize edilemezler. Bunun anlamı let
veya const
ile tanımlanan bir değişken scope içerisinde en üst satıra taşınır fakat deklarasyonu yapılamadan kullanılamazlar. Şayet hoist özelliğini kullanırsak ReferenceError
hatası ile karşılaşırız. değişken temporal dead zone'a6 düşer. Bu durumdaki değişkenler deklarasyonu yapılıp veri depolandıktan sonra kullanılabilir.
❗ JavaScript'de hoist özelliğini şahsen kullanılmamasını tavsiye ederim. Çünkü bu bazen hangi verinin nereden geldiğinin zor anlaşılmasına neden olur. İdeal olan bir değişkeni ile depolayacağı veriyi aynı satırda deklarasyonunu yapmak olacaktır.
%%javascript
// Örnekte önce değişkeni kullanıyoruz ikinci satırda tanımlamasını yapıyoruz. Buna hoist adı verilir.
carName = "Lada";
var carName;
// Konsola "Lada" ifadesi yazılır.
console.log(carName);
// ❌ let veya const ile tanımlanan değişkenlerde hoist özelliğini kullanılması durumunda ReferenceError hatası ile karşılaşırız.
model = "Niva";
let model;
Footnotes
-
Scope bir değişkenin erişebilir olduğu alanı ifade etmek için kullanılan terimdir. ↩
-
Conditional statement JavaScript'de bir takım çıktılara göre programın akışını değiştirmek isteyebiliriz bu durumda
if else else if
gibi ifadelerden faydalanırız. Bunlara conditional statement adı verilir. ↩ -
JavaScript'de bir değişkeninin içeriği başka bir değişkene kopyalanabilir. Genel olarak bu tanım alias kavramını oluşturur. Alias'lar anlaşılabilir ve semantic kodlar yazmamızı sağlarlar. Örneğin
let x=5; var aliasVariable=x;
şeklindeki bir ifade dex
ilealiasVariable
aynı değeri paylaşırlar.x
referans olarak ifade edilirken,aliasVariable
alias olarak ifade edilir. ↩ -
Bunu bir metafor üzerinden açıklayacağım. Matematikte evrensel küme kavramını biliriz. Evrensel küme diğer kümeleri kapsaması gibi JavaScript'de global scope içerisinde tanımlanmış değişken veya metotları (fonksiyonları) kapsar ve script'in her yerinden erişilebilir kılar. Yani global scope burada evrensel küme olarak ifade edilebilir. Bu anlamda geneldirler. ↩
-
Bir metot (fonksiyon) içerisindeki tanımlanan değişkenleri veya başka metotları ifade eder. Function scope içerisindeki değişkenler dışarıdan erişilip kullanılamaz sadece tanımlandığı scope içerisinde kullanılabilir. Bu anlamda özeldirler. ↩
-
Hoisting için kullanılan bu kavram, bir değişkenin ulaşılamaz ve kullanılamaz olduğunu ifade etmek için kullanılır. Ta ki değişkeni tanımlandıktan sonra kullanılana kadar. ↩
Top comments (0)