Ritim İstanbul A5 Blok No:46, D:112, 34846 Maltepe/İstanbul

JavaScript’te değişkenler ve aralarındaki farklar: var, let & const

Bu içerik JavaScript'in web geliştirmedeki rolüne odaklanarak, değişkenlerin bu dilin temel yapı taşlarından biri olduğunu belirtir. Metin, JavaScript'teki değişken tanımlamanın temel prensiplerini ve en iyi uygulamalarını kapsamlı bir şekilde ele alarak, bu konuda temel bir rehber sunar. Bu, okuyuculara JavaScript değişkenleri hakkında derinlemesine bir bakış sağlar ve bu konuların pratik uygulamalarını vurgular.

JavaScript, web geliştirmenin temel taşlarından biri olarak, dinamik ve etkileşimli web siteleri oluşturmanın anahtarıdır. Bu güçlü programlama dilinin en temel yönlerinden biri, veri saklama ve manipülasyon mekanizması olan ‘değişkenler’dir. Modern JavaScript’te değişken tanımlama, üç anahtar kelimeyle gerçekleşir: var, let, ve const. Her biri benzersiz özelliklere ve kullanım alanlarına sahiptir ve doğru kullanıldığında, JavaScript programlamanızı daha etkili ve hatasız hale getirebilir.

Bu blog yazısında, JavaScript‘teki bu üç değişken tanımlama yönteminin farklılıklarını, avantajlarını ve ne zaman kullanılması gerektiğini detaylıca inceleyeceğiz. var‘ın esnekliğinden let‘in kapsam kontrolüne ve const‘ın sabit değerler için kullanımına kadar, bu kavramların her birini ayrı ayrı ele alarak, JavaScript’teki değişkenlerin nasıl çalıştığını ve en iyi uygulamaları anlamaya çalışacağız.

- ADT Çözümleri -
Yönetilen Hizmetler Görseli
Advanced Dynamics Teknoloji'de işletmeler için dış kaynaktan hizmet modeliyle Yönetilen Hizmetler çözümleri sunuyoruz.

Bu içeriği doğru bir şekilde okuyup kavradıktan sonra, JavaScript’in temellerini pekiştirecek ve bu üç değişken tanımlama anahtar kelimesinin neden ve nasıl kullanıldığını öğrenerek, kod yazma becerilerinizi bir adım daha ileriye taşıyacaksınız. Öyleyse, JavaScript’te değişkenlerin dünyasına dalalım ve var, let, ve const arasındaki ince farkları keşfedelim.

JavaScript’te Değişkenlere Bir Giriş

Değişkenler Nedir?

JavaScript’te bir değişken, veri saklamak için kullanılan bir konteynırdır. Değişkenler, programınızın farklı bölümlerinde kullanılacak değerleri depolamak ve erişmek için bir isim (tanımlayıcı) ile ilişkilendirilir.

Değişkenler sayılar, metinler, diziler, nesneler, fonksiyonlar gibi farklı veri tiplerini içerebilirler. Değişkenler, programlama yaparken verileri tekrar tekrar kullanmak veya değiştirmek için çok yararlıdır.

JavaScript’te değişken oluşturmak için var, let veya const anahtar kelimelerini kullanabilirsiniz. Bu anahtar kelimeler arasındaki farklar şunlardır:

  • var: Değişkenin değerini ve kapsamını (scope) değiştirmenize izin verir. Eski JavaScript sürümlerinde değişken oluşturmak için kullanılırdı. Artık pek tercih edilmiyor.
  • let: Değişkenin değerini değiştirmenize izin verir, ancak kapsamını sınırlar. Değişken, tanımlandığı kod bloğu içinde geçerlidir. Yeni JavaScript sürümlerinde değişken oluşturmak için kullanılır.
  • const: Değişkenin değerini ve kapsamını değiştirmenize izin vermez. Değişken, tanımlandığı kod bloğu içinde geçerlidir ve sabit bir değere sahiptir. Değişkenin değeri değişmeyecekse veya değişmemesi gerekiyorsa kullanılır.

Daha da aşağıda bu değişkenler daha detaylı bir şekild ele alınmıştır.

Değişken oluştururken aşağıdaki kurallara dikkat etmelisiniz:

  • Değişken isimleri harf, rakam, alt çizgi (_) ve dolar işareti ($) içerebilir.
  • Değişken isimleri bir harf, _ veya $ ile başlamalıdır. Rakam ile başlayamaz.
  • Değişken isimleri büyük-küçük harfe duyarlıdır (x ve X farklı değişkenlerdir).
  • Değişken isimleri JavaScript’in rezerve ettiği anahtar kelimeler olamaz (var, let, const, if, for, function vb.).

Aşağıda JavaScript’te değişken oluşturma örnekleri verilmiştir:

// var ile değişken oluşturma
var x = 10; // x değişkenine 10 değerini atama
var y = "Merhaba"; // y değişkenine "Merhaba" metnini atama
var z = x + y; // z değişkenine x ve y değişkenlerinin birleşimini atama
console.log(z); // z değişkenini konsola yazdırma

// let ile değişken oluşturma
let a = 20; // a değişkenine 20 değerini atama
let b = "Dünya"; // b değişkenine "Dünya" metnini atama
let c = a + b; // c değişkenine a ve b değişkenlerinin birleşimini atama
console.log(c); // c değişkenini konsola yazdırma

// const ile değişken oluşturma
const PI = 3.14; // PI değişkenine 3.14 değerini atama
const R = 5; // R değişkenine 5 değerini atama
const alan = PI * R * R; // alan değişkenine PI ve R değişkenlerinin çarpımını atama
console.log(alan); // alan değişkenini konsola yazdırma

Bu giriş bölümü, JavaScript’te değişkenler hakkında temel bilgileri içermektedir. Daha fazla bilgi için aşağıdaki kaynaklara bakabilirsiniz:

Değişkenler Nasıl Tanımlanır?

  • JavaScript’te bir değişken tanımlamak için var, let, veya const anahtar kelimeleri kullanılır. Örneğin:
  var name = "Alice";
  let age = 25;
  const birthYear = 1995;

Değişken Türleri

  • var (Eski Standart): En genel değişken tanımlama yöntemidir. Fonksiyon kapsamlıdır ve yeniden tanımlanabilir.
  • let (Yeni Standart): Blok kapsamlıdır ve daha kontrollü bir kullanım sağlar. Yeniden tanımlanamaz ama değeri değiştirilebilir.
  • const (Sabit Değerler İçin): Blok kapsamlıdır ve değişkenin değeri değiştirilemez. Sabit (immutable) değerler için kullanılır.

Kapsam (Scope)

  • Fonksiyon Kapsamı: var ile tanımlanan değişkenler bu kapsamdadır. Yalnızca tanımlandıkları fonksiyon içinde erişilebilir.
  • Blok Kapsamı: let ve const ile tanımlanan değişkenler bu kapsamdadır. Yalnızca tanımlandıkları kod bloğu içinde erişilebilir (örneğin, bir döngü veya if bloğu).

Değişkenlerin Özellikleri

  • Yeniden Atama: var ve let ile tanımlanan değişkenlerin değerleri değiştirilebilir.
  • Sabitlik: const ile tanımlanan değişkenler sabittir; bir kez tanımlandıktan sonra değerleri değiştirilemez.
  • Hoisting: JavaScript’te değişken tanımlamaları kodun başına çekilir. var ile tanımlanan değişkenlere, tanımlamadan önce erişilebilir ve undefined değeri döndürür. let ve const ile tanımlananlara erişim, tanımlamadan önce yapılamaz ve hata verir.

Neden let ve const?

  • var‘ın aksine, let ve const, JavaScript’te daha modern ve güvenli programlama uygulamalarını teşvik eder. Blok kapsamlı olmaları ve daha sıkı kapsam kurallarına sahip olmaları nedeniyle, yanlışlıkla hatalara veya beklenmeyen davranışlara neden olma olasılıkları daha düşüktür.

Değişken Tanımlama Önerileri

  • Genel kullanım için let kullanın.
  • Değerinin değişmemesi gereken sabitler için const kullanın.
  • var‘dan kaçının; eski kodlarda görebilirsiniz ama modern JavaScript’te let ve const tercih edilmektedir.

Değişkenler, JavaScript programlamada temel yapı taşlarından biridir ve kodunuzun verimli ve okunabilir olması için doğru şekilde kullanılmaları önemlidir.

Tabii ki, var, let ve const hakkında daha ayrıntılı bilgiler vererek, her birini ayrı bir giriş olarak ele alalım:

JavaScript değişkenleri

1. var

Tanım:

  • var anahtar kelimesi, JavaScript’te değişken tanımlamak için kullanılan eski bir yöntemdir. Fonksiyon bazında kapsam (scope) belirler.

Özellikleri:

  • Fonksiyon Kapsamı: var ile tanımlanan değişkenler, tanımlandıkları fonksiyon içerisinde erişilebilir. Fonksiyon dışında tanımlandığında global kapsamda olur.
  • Yeniden Tanımlanabilir: Aynı isimle birden fazla var değişkeni tanımlanabilir.
  • Yeniden Atanabilir: Değerleri sonradan değiştirilebilir.
  • Hoisting: Değişken tanımlamaları, kodun en üstüne “çekilir”. Değişkene atama yapılmadan önce erişildiğinde undefined değeri döner.

Kullanım Örneği:

var greeting = "Hello, world!";
console.log(greeting); // "Hello, world!"
greeting = "Hello, again!";
console.log(greeting); // "Hello, again!"
var greeting = "New greeting!";
console.log(greeting); // "New greeting!"

2. let

Tanım:

  • let, ES6 ile tanıtılan ve değişken tanımlamak için kullanılan modern bir anahtar kelimedir. Blok bazında kapsam belirler.

Özellikleri:

  • Blok Kapsamı: let ile tanımlanan değişkenler, yalnızca tanımlandıkları blok (örn. ifade, döngü) içinde erişilebilir.
  • Yeniden Tanımlanamaz: Aynı blok içinde aynı isimle yeniden tanımlanamaz.
  • Yeniden Atanabilir: Değerleri sonradan değiştirilebilir.
  • Hoisting: let değişkenleri hoisted edilir ancak tanımlamadan önce erişilmeye çalışıldığında Referans Hatası verir.

Kullanım Örneği:

let message = "Hello, world!";
console.log(message); // "Hello, world!"
message = "Hello, again!";
console.log(message); // "Hello, again!"
// let message = "New message!"; // Hata: 'message' zaten tanımlanmış

3. const

Tanım:

  • const, sabit değerler tanımlamak için kullanılan bir anahtar kelimedir. let gibi, blok bazında kapsam belirler.

Özellikleri:

  • Blok Kapsamı: const ile tanımlanan değişkenler, yalnızca tanımlandıkları blok içinde erişilebilir.
  • Yeniden Tanımlanamaz ve Atanamaz: Hem yeniden tanımlama hem de yeniden atama yapılması yasaktır.
  • Sabitleme: Başlangıçta bir değer atanmalıdır ve bu değer sonradan değiştirilemez.
  • Hoisting: const değişkenleri hoisted edilir ancak tanımlamadan önce erişilmeye çalışıldığında Referans Hatası verir.

Kullanım Örneği:

const greeting = "Hello, world!";
console.log(greeting); // "Hello, world!"
// greeting = "Hello, again!"; // Hata: 'greeting' bir sabittir, değeri değiştirilemez
// const greeting = "New greeting!"; // Hata: 'greeting' zaten tanımlanmış

Her bir değişken tanımlama yöntemi, JavaScript programlamanın farklı gereksinimlerine hitap eder ve doğru kullanıldığında kodun okunabilirliğini ve yönetilebilirliğini artırır.

Moment.js nedir ve nasıl kullanılır?

JavaScript kütüphaneleri programlama sektöründe sıklıkla karşılaşılan sorunları çözmek ve otomatikleştirmek için geliştirilir. Popüler JavaScript kütüphanelerinden biri de Moment.js'tir. Peki Moment.js nedir ve programlama dünyasında...

Fiyat takip yazılımları nasıl çalışır?

E-ticaret dünyası her geçen gün daha rekabetçi bir hal alıyor. Bu ortamda, işletmelerin rakiplerini ve pazar trendlerini yakından takip etmeleri hayati önem taşıyor. İşte...

HTML div elementi ve kullanım senaryoları

Her gün milyonlarca web sayfasını ziyaret ediyor, okuyor veya üzerlerinde işlem yapıyoruz. Peki, son kullanıcılar için görsel olarak renderlanan bu sayfaların arkasındaki kodlarda kullanılan...

React ‘hook’ nedir ve ne için kullanılır?

React hook, React JavaScript kitaplığındaki bir özelliktir. Hook'lar, sınıf bileşenlerine ihtiyaç duymadan, fonksiyon bileşenlerinde durum (state) ve diğer React özelliklerini kullanmaya olanak tanır. İlk...

IPv4 ve IPv6 nedir? Aralarındaki farklar nelerdir?

Her gün internete bağlanıyoruz, ancak teknik olarak internete nasıl bağlandığımızla ilgili bir fikriniz var mı? İnternet, modern yaşamın ayrılmaz bir parçası haline geldi ve...

addEventListener ve windows.onload arasındaki fark nedir?

JavaScript'te web sayfalarının yüklenmesi ve kullanıcı etkileşimleri gibi olaylara yanıt verme yöntemleri arasında önemli bir ayrım bulunur: addEventListener ve window.onload. Her iki yaklaşım da,...

Daha fazla blog içerik

Moment.js nedir ve nasıl kullanılır?

JavaScript kütüphaneleri programlama sektöründe sıklıkla karşılaşılan sorunları çözmek ve otomatikleştirmek için geliştirilir. Popüler JavaScript kütüphanelerinden biri de Moment.js'tir. Peki Moment.js nedir ve programlama dünyasında...

Fiyat takip yazılımları nasıl çalışır?

E-ticaret dünyası her geçen gün daha rekabetçi bir hal alıyor. Bu ortamda, işletmelerin rakiplerini ve pazar trendlerini yakından takip etmeleri hayati önem taşıyor. İşte...

HTML div elementi ve kullanım senaryoları

Her gün milyonlarca web sayfasını ziyaret ediyor, okuyor veya üzerlerinde işlem yapıyoruz. Peki, son kullanıcılar için görsel olarak renderlanan bu sayfaların arkasındaki kodlarda kullanılan...

React ‘hook’ nedir ve ne için kullanılır?

React hook, React JavaScript kitaplığındaki bir özelliktir. Hook'lar, sınıf bileşenlerine ihtiyaç duymadan, fonksiyon bileşenlerinde durum (state) ve diğer React özelliklerini kullanmaya olanak tanır. İlk...