JavaScript’te Scope Kavramı

A. Oğuz
4 min readNov 6, 2020

Herkese merhaba bu yazımda scope kavramını dilimin döndüğünce açıklamaya çalışacağım. Scope kavramı sadece javascript’e ait bir kavram değil günümüzdeki dillerde de mevcut bir kavram ben bugün size scope kavramını javascript kullanarak anlatmaya çalışacağım.

Bu yazıda şu konular üzerinde duracağım.

  • Scope nedir ?
  • Neden Scope ?
  • JavaScript’te Scope
  • var, let , const
  • Block Scope

Scope Nedir ?

Scope ilgili değişkenlere ilgili yerlerden ulaşabilmemizi sağlayan bir yapıdır. Kodumuzdaki değişkenlerin görünürlüğüdür.

Neden Scope kullanırız ?

Scope kullanmamızın en önemli nedeni güvenliktir. Koddaki tanımlanan tüm değişkenlerin tüm fonksiyonlar tarafından bilinmesi ileride ciddi sıkıntılar yaratabilir. Bununla ilgili olarak şöyle düşünebiliriz. Telefonunuzdaki tüm bilgilerin diğer uygulamalar tarafından okunabildiğini düşünün eğer uygulamalara telefon üzerinde sınırlı erişim verirsek daha düzenli ve güvenliğini daha iyi yönetebilmiş oluruz. Tıpkı kodumuzdaki scope kavramı da buna benziyor. Bir diğer sebep ise bellek yönetimi, birazdan bahsedeceğim scope türlerine göre değişkenler bellekte tutuluyor ve bu belli süre sonra bellek kontrolü açısından sorunlara yol açabilir.

JavaScript’te Scope

ES5'den önce JavaScript’teGlobal Scope ve Function Scope olarak iki çeşit scope türü vardı ES6 ile Local Scope geldi.

  • Global Scope
  • Local Scope

Global Scope

Programda fonksiyonların dışında tanımlanan her yerden erişilebilen scope tipidir. Global scope olarak tanımlanan bir değişkene dosya içinde her yerden erişilebilir. Bu tip değişkenlere global değişken adı verilir. Local scopede değişkenler işleri bittiğinde bellekten silinir fakat global olarak tanımlanan değişken varlığına devam eder bu durum ilerleyen zamanlarda bellek sorunlarına yol açabilir bu yüzden global değişkenleri kullanmaya dikkat edelim.

name değişkeni global olarak tanımlandığı için fonksiyon içinden de erişilebilir

Tanımlanan global değişkene fonksiyon içinden değerini değiştirdik ve fonksiyon dışında kullandığımızda güncellenmiş olarak çıktı verdi.

Local Scope

Local Scope fonksiyon içerisinde tanımlanan değişkenlerdir. Fonksiyon dışından bu değişkenlere erişemeyiz.

fonksiyon içinde tanımlanan sayı değerini başarı ile bastırabildik fakat fonksiyon içinde tanımlanan sayi1 değerine fonksiyon dışından erişilemediği için ReferenceError hatası aldık.

Local scope içindeki değişkenler sadece kendi içinde geçerli oldukları için farklı fonksiyonlarda aynı isimle değişken oluşturabiliriz.

var, let , const

var : Variable olarak geçer tanımlandığı değerin türünü alır. var function scope tabanlı olduğu için güvenlik ve okunabilirlik sorunlarına neden oluyordu. ES6 ile let const ifadeleri ile bu problemin önünde geçilmiştir.

let : ES6 ile gelmiştir. Block scope tabanlıdır.

const : sabit(constant) yani tanımlandıktan sonra yeni bir değer atılamıyor const ile tanımlanan değişken ismi ile yeniden bir değişken oluşturulamıyor.

PI değişkeni const(sabit) olarak tanımlandığı için daha sonradan değiştirilemez.

Fakat const olarak tanımlanan bir değişkende herhangi bir değeri değiştirmemiz mümkün değil ancak const olarak tanımlanan dizi ve nesnelere ekleme ve değiştirme işlemleri yapabiliriz.

JavaScript’te ES6 ile birlikte pek çok yenilik gelmiştir. Bununla birlikte scope kavramında da değişiklikler yaşandı. ES6 öncesinde blcok scope olamadığı için function scope ile local scope aynı sayılabilirdi ama ES6 ile hayatımıza giren const let ifadeleriyle block scope kavramı oraya çıkmıştır.

Blok İfadeleri (Block Scope)

Süslü parantezler ( {} ) içerisinde tanımlı olan scopedir. if, for, while gibi ifadeler parantezleri içerisinde block scope oluşturur. Block scope if, for,while bloklarında const let ifadeleri için geçerlidir. var anahtar kelimesi ile tanımlanan bir değişken bulunduğu scope’ye bağlı olur.

burada var olarak tanımlandığı için bulunduğu scope’ye aittir

yukarıda oluşturduğumuz kod bloğunda var ile tanımlandığı için bilgi fonksiyonunun oluşturduğu scope’ye aittir. Şimdi bu örneği bir de let ile deneyelim.

let ile tanımlanan değişken bulunduğu parantezlerde block scope oluşturur.

let ile tanımladığımız yenidegisken bulunduğu yerde block scope oluşturdu ve parantezlerin dışından okunamaz hale geldi. Block scope olması için if for gibi kalıplara ihtiyacımız yok kod içerisinde açacağımız süslü parantezler içine let const ile tanımladığımız değer de block scope oluşturur.

bilgi fonksiyonu içinde tanımlanan degisken değeri yine kendi parantezleri içinde yazdırıldığı için ekrana çıktıyı verdi. Fakat az önce de bahsettiğimiz gibi block scope olması için if,for gibi kalıplar olmadan sadece kendi içinde tanımlanan süslü parantezler içerisinde de gerçekleştirebiliyoruz.

Kısaca toparlamak gerekirse JavaScript’te scope kavramı global ve local scope üzerinde yoğunlaşıyor ama ES6 ile birlikte hayatımıza giren var let ile birlikte block scope kavramı oluşmuştur.

Global Scope : Fonksiyonun dışında tanımlanır ve dosyanın her yerinden erişilebilir.

Local Scope : Tanımlandığı fonksiyonlar içinde geçerlidir. Fonksiyon içinden erişilebilir.

let ve const : block scope tabanlı tanımlanan değişkene en yakın parantezler içinde geçerlidir.

Block Scope : let ve const ile tanımlandığında if,for,while ya da sadece açılmış parantezler olsun bu parantezler içinde geçerlidir.

Bu yazımda sizlere genel olarak JavaScript’teki Scope kavramından bahsetmek istedim umarım faydalı olmuştur. Önerilerinizi için bana Linkedin üzrinden erişebilirsiniz. Yeni yazılarımda görüşmek üzere :)

--

--