javaScript Var, Let ve Const

ES6'da, değişkeni tanımlamanın yeni bir yolu const ve let keyword'leri . ES6'dan önce, geliştiriciler farklı değişkenleri bildirmek için var kullanırdı. Ancak, javascript kod blogunda olası sorunlara veya örtülü hatalara neden olabilir. Bu yazıda const, let ve var keywordlerini karşılaştırma yapalım.

Keyword	Var	Let	Const
Global Scope	Yes	Yes	Yes
Function Scope	Yes	Yes	Yes
Blok Scope	No	Yes	Yes
Yeniden Atanabilir	Yes	Yes	No

ES2015'ten önce JavaScript'in yalnızca iki scope(kapsamı) vardı: Global Kapsam ve fonksiyon Kapsamı. ES6 ile local Scope geldi.

Scope: Değişkeni tanımladığınız bölgeye göre isimlendirilir ve değişken de o bölgenin ismiyle anılır.

Global Scope: Bir fonksiyon ve blok dışında bildirilen JavaScript kodun herhangi bir yerindede tanımlanan değişken GLOBAL olur.

Local Scope: Bir fonksiyon içerisinde tanımlanan değişkenlerdir Local(yerel) değişkenlerdir. Dışarıdan bu değişkenlere erişemezsiniz.

Blok Scope: Block scope her türlü { } süslü parantez arasında olan kısma denir. if-for deyimleri gibi.

Global Kapsam

Global olarak ilan edilen değişkenler (herhangi bir fonksiyonun dışında) Global Scope'a sahiptir.

var carName = "Fiat Egea";
 
//burada carName kod kullanabilirsiniz
 
console.log(carName);
 
function myFunction() {

// Buradaki carName kod kullanabilir

  console.log("fonksiyondaki..:",carName);
}

myFunction();

Genel değişkenlere bir JavaScript programındaki herhangi bir yerinden erişilebilir.

Fonksiyon Kapsamı

Local(Yerel) olarak bildirilen değişkenler (Fonksiyon içinde) Fonksiyon Kapsamına sahiptir.

// burada carName kod kullanılamaz

function myFunction() {
  var carName = "Fiat Egea";
  // burada carName kod kullanabilir
}

//burada carName kod kullanılamaz

Local(Yerel) değişkenlere, yalnızca bildirildikleri fonksiyon içinden erişilebilir.

JavaScript Blok Kapsamı

Var anahtar sözcüğüyle bildirilen değişkenler , Blok Kapsamına sahip olamaz .

Bir { } blokda bildirilen değişkenlere bloğun dışından erişilebilir.

if(true){ 

  var x = 2; 
}
// x kod burada kullanılır

console.log(x);

ES2015'ten önce JavaScript'in Blok Kapsamı yoktu .

Let anahtar kelimesi ile bildirilen değişkenler Blok Kapsamına sahip olabilir.

Bir { } bloğunda bildirilen değişkenlere bloğun dışından erişilemiyor:

if(true){

  let x = 2;
}
//x kod burada kullanılamaz

Değişkenlerin Yeniden Yazılması

Var anahtar sözcüğünü kullanarak bir değişkeni yeniden yazmak, sorunlara neden olabilir.

Bir bloğun içindeki bir değişkeni yeniden değiştirmek, ayrıca bloğun dışında değişken yazdırılırsa yeni değer yazılır.

var x = 10;
// Burada x değeri 10

if(true){ 
  var x = 2;

  // Burada x değeri 2
}

// Burada x değeri 2

Let anahtar sözcüğünü kullanarak bir değişkeni tekrarlayarak Değiştiremezsiniz.

Bir bloğun içindeki bir değişkeni tekrar tanımlamak, bloğun dışındaki değişkenin değerini değiştirmeyecektir.

var x = 10;
// Burada x değeri 10

if(true){ 

  let x = 2;

  // Burada x değeri 2
}
// Burada x değeri 10

Döngü Kapsamı

var i = 5;

for (var i = 0; i < 10; i++) {
  // kodlar
}

console.log(i);//10

Yukarıdaki örnekte görüldüğü üzere çıktı:10 olur Döngüde i değişkeni i=10 olur ve blok dışındada var ile tanımlanan değişken enson döngü içinde belirtildiği için yeni değeri döngüde ki değeri alır.

Örneğimizde bu sefer Değişkeni let ile tanımlarsak:

let i = 5;

for (let i = 0; i < 10; i++) {
  // Kodlar
}

console.log(i);//5

Döngüde blok scope'de i değişkeni geçerlidir global scope'de i=5 olduğu için consola 5 yazdı.

Fonksiyon Kapsamı

Var ve let keyword'ler fonksiyon scope'da aynı özelliklere sahiptir. Her ikiside fonksiyon scope'a sahiptir, fonksiyon dışında geçerli değillerdir.

function myFunction() {

  var carName = "Fiat Egea";   // Function Scope
}

function myFunction() {

  let carName = "Fiat Egea";   // Function Scope
}

Global Kapsam

Var, let ve const ile bildirilen değişkenler , blok dışında bildirildiğinde oldukça benzerdir. Her üçünün'de Global Kapsamı olacaktır.

var x = 2; // Global scope

let x = 2; // Global scope

const X = 2; // Global scope

Global Nesne

JavaScript’in global nesnesi web tarayıcılarında window nesnesidir.

Var anahtar sözcüğü ile tanımlanan genel değişkenler , global window nesnesine aittir. window nesnesinin özellikle hız ile sorunları bulunmakta.

Genel nesnenin tüm özellikleri genel değişkenlerdir. Genel kapsamda, aşağıdaki bildirimler bu tür özellikler oluşturur:

• var bildirimi
• Function bildirimi

Ancak şimdi global nesnenin özellikleri olmayan global değişkenler de var. Global kapsamda, aşağıdaki bildirimler böyle değişkenler oluşturur.

• let bildirimi
• const bildirimi
• Class bildirimi

ÖRNEK:

var sayi = 50;

console.log(window.sayi) // 50

let sayi = 50;

console.log(window.sayi) //undefined

Yükselme

Javascript’in tuhaflıklarından biri, değişkenleri ve fonksiyonları, ilan edilmeden önce bile kullanabilmenizdir. Buna hoisting(Yükselme) denir. Yükseltme, bir bildirimi geçerli komut dosyasının veya geçerli fonksiyonun en üstüne taşıyan JavaScript'in varsayılan davranışıdır. Değişken bir fonksiyonda tanımlanırsa, bildirim fonksiyon içindeki en üst düzeye çıkarılır ve fonksiyon dışında tanımlanırsa, bildirim genel bağlamın üst düzeyine çıkarılır.

Var ile tanımlanan değişkenler en üste Yükseltilir. ( Js hoisting )

Bir değişkeni bildirilmeden önce kullanabilirsiniz:

merhaba();

function merhaba() {
   console.log('merhaba');
}

Fonksiyon çalışır consola "merhaba" yazdırır. Başka bir örnek:

ders = 'javaScript';

console.log(ders); //javascript

var ders;

Let ile tanımlanan değişkenler en üste Yükseltilemez.

Bildirilmeden önce bir let değişkeni kullanılması ReferenceError ile sonuçlanacaktır.

Geçici Ölü Bölge :Tanımlamadan önce değişkene erişemezsiniz.

ders = 'javaScript';

console.log(ders); //ReferenceError:

let ders;

Yeniden Beyan Etme

Bir programın herhangi bir yerinde Var değişkeniyle bir JavaScript değişkenini yeniden belirtmek mümkündür :

var x = 2;

// X'in değeri 2
 
var x = 3;

// şimdi x = 3
console.log(x); //3

javaSript'de yeniden tanımlama işlemi Var ve let değişkeni, aynı kapsamda, ya da aynı blokta, izin verilmez:

var x = 2; // İzin verildi
let x = 3; // İzin verilmez

{
  var x = 4;   // İzin verildi
  let x = 5   // İzin verilmez
}

Bir let değişkeninin aynı kapsamda veya aynı satırda let ile yeniden bildirilmesine izin verilmez:

let x = 2;  // İzin verildi
let x = 3;  // İzin verilmez

{
  let x = 4; // İzin verildi
  let x = 5; // İzin verilmez
}

Yeniden tanımlamak let ve var değişkeni aynı kapsamda, ya da aynı blokta, izin verilmez:

let x = 2; // İzin verildi
var x = 3; // İzin verilmez

{
  let x = 4; // İzin verildi
  var x = 5; // İzin verilmez
}

Const Bildirimi

const PI = 3.14;

console.log(PI); // 3.14

PI = 10; // error

Const anahtar kelime biraz yanıltıcıdır.

Sabit bir değer tanımlamaz. Bir değere sabit bir referans tanımlar.

Bu nedenle, sabit ilkel değerleri değiştiremeyiz, ancak nesne özelliklerini ve dizi öğelerini yine de değiştirebilirsiniz.

// Bir const nesnesi oluşturabilirsiniz:

const car = {type:"Fiat", model:"Egea", color:"white"};

// Bir özelliği değiştirebilirsiniz:

car.color = "red";

//  Bir özellik ekleyebilirsiniz:

car.fuel = "diesel";


// Dizi elemanını değiştirme

const COLORS = ["red", "green", "blue"];

console.log(COLORS[0]); // red

COLORS[0] = "yellow";

console.log(COLORS[0]); // yellow

const anahtar kelime, sabitleri tanımlamayı mümkün kılar. Sabitler salt okunur, const ile tanımlanan değişkenlere yeni değerler atayamazsınız.

Değişkenleri adlandırmanın yolları veya stilleri

1. snake_case

var ders_adi = "javaScript";

2. camelCase

var dersAdi = "javascript";

8264

Gönder