JavaScript'te global, local ve lexical scope kavramları

2019-08-15

Scope dediğimiz şeyi kabaca mobil şebekelerin kapsama alanına benzetebiliriz. Genelde asansörlerde cep telefonu ile konuşurken bağlantınız kopabiliyor. İşte JavaScript'te de bir fonksiyonun veya bir değişkenin ulaşılabileceği veya ulaşılamayacağı alanları scope kavramı ile anlamlandırıyoruz. Global, local ve lexical olmak üzere üç farklı scope var. Gelin bunları yakından inceleyelim.

Global Scope

Bir değişken veya bir fonksiyon global scope içerisinde her yerden ulaşılabilir vaziyettedir.

// Bu global scope içerisinde bir değişken tanımlaması
const aksamYemegi = 'lahmacun';

function aksamYemeginiYazdir() {
  // Konsola "lahmacun" değerini yazacak
  console.log(aksamYemegi);
}
aksamYemeginiYazdir();

// Bu da konsola "lahmacun" değerini yazacak
console.log(aksamYemegi);

Local Scope

Sadece belli başlı yerlerden ulaşabileceğiniz fonksiyon ve değişkenler local scope içerisindedir.

function aksamYemeginiYazdir() {
  // Burası bu fonksiyonun local scope'u
  const aksamYemegi = 'lahmacun';
  // Konsola "lahmacun" değerini yazacak
  console.log(aksamYemegi);
}
aksamYemeginiYazdir();

// Hata mesajı döndürür
// Buradan başka bir fonksiyonun local scope'una ulaşılamaz
console.log(aksamYemegi);

Lexical Scope

JavaScript'e has özelliklerden birisi de bir fonksiyon içerisinde başka bir fonksiyon tanımlayabilirsiniz. Bu durum da doğal olarak farklı bir scope oluşturuyor.

Eğer içerisinde değişken tanımlamış olduğunuz bir fonksiyon içerisinde bir fonksiyon daha tanımlarsanız, içerideki fonksiyondan dışarıdaki fonksiyonun local scope'una erişebilirsiniz ki artık orasının adı lexical scope olarak adlandırılıyor olacak. Fakat dışarıdaki fonksiyondan, içerideki fonksiyonun local scope'una ulaşamazsınız.

İlk defa okuyunca biraz karmaşık gelebilir. Umarım aşağıdaki örnekler daha doyurucu bir anlatım yapmış olur sizler için.

function yemekleriYazdir() {
  // Burası artık lexical scope olarak adlandırılıyor
  const ogleYemegi = 'adana kebap';

  function aksamYemeginiYazdir() {
    // Bu satır "adana kebap" değerini konsola yazacak
    console.log(ogleYemegi);
  }
  aksamYemeginiYazdir();

  // Bu satır da "adana kebap" değerini konsola yazacak
  console.log(ogleYemegi);
}
yemekleriYazdir();

// Burdan mevzubahis değişkene ulaşılamaz
// Hata mesajı dönecek
console.log(ogleYemegi);