Değişkenler, bir değere temsili bir ad atayan bir veri yapısıdır. Her tür veri içerebilirler.
Değişkenin adı tanımlayıcı olarak adlandırılır. Geçerli bir tanımlayıcı aşağıdaki kurallara uymalıdır:
- Tanımlayıcılar Unicode harfleri, dolar işaretleri ($), alt çizgi karakterleri (_), rakamlar (0-9) ve hatta bazı Unicode karakterleri içerebilir.
- Ayrıştırıcı, giriş öğelerini ayırmak için boşluk kullandığından tanımlayıcılarda boşluk bulunamaz. Örneğin,
myVariable
yerinemy Variable
değişkenini çağırmaya çalışırsanız ayrıştırıcımy
veVariable
olmak üzere iki tanımlayıcı görür ve söz dizimi hatası ("beklenmedik jeton: tanımlayıcı") oluşturur. Tanımlayıcılar bir harf, alt çizgi (
_
) veya dolar işareti ($
) ile başlamalıdır. Rakamlar ile tanımlayıcılar arasındaki karışıklığı önlemek için rakamla başlayamaz:let 1a = true; > Uncaught SyntaxError: Invalid or unexpected token
JavaScript, tanımlayıcıların başında sayılara izin verseydi yalnızca sayılardan oluşan tanımlayıcılara izin vermiş olurdu. Bu da sayı olarak kullanılan sayılar ile tanımlayıcı olarak kullanılan sayılar arasında çakışmalara neden olurdu:
let 10 = 20 10 + 5 > ?
Sentaktik olarak anlamlı olan "ayrılmış kelimeler" tanımlayıcı olarak kullanılamaz.
Tanımlayıcılar özel karakterler (
! . , / \ + - * =
) içeremez.
Aşağıdakiler, tanımlayıcı oluşturmayla ilgili katı kurallar değil, kodunuzu yönetmeyi kolaylaştıran sektördeki en iyi uygulamalardır. Projenizde farklı standartlar varsa tutarlılık için bu standartları uygulayın.
JavaScript'in yerleşik yöntemleri ve özellikleri tarafından belirlenen örnekten yola çıkarak, devrik tırnak (ayrıca "camelCase" olarak stilize edilir) birden fazla kelimeden oluşan tanımlayıcılarda çok yaygın bir kullanım şeklidir. Camel case, okunabilirliği artırmak için ilk kelime hariç her kelimenin ilk harfini büyük yazmak ve boşluk kullanmamaktır.
let camelCasedIdentifier = true;
Bazı projeler, bağlama ve verilerin yapısına bağlı olarak başka adlandırma kuralları kullanır. Örneğin, sınıfların ilk harfi genellikle büyük harf olarak yazılır. Bu nedenle, çok kelimeli sınıf adlarında genellikle "büyük başak düzeni" veya Pascal düzeni olarak adlandırılan bir başak düzeni varyantı kullanılır.
class MyClass {
}
Tanımlayıcılar, içerdikleri verilerin doğasını kısaca açıklamalı (ör. currentMonthDays
, theNumberOfDaysInTheCurrentMonth
'ten daha iyi bir addır) ve bir bakışta net bir şekilde okunmalıdır (originalValue
, val
'ten daha iyidir). Bu modülde kullanılan myVariable
tanımlayıcıları, bağımsız örnekler bağlamında işe yarar ancak içerdikleri veriler hakkında hiçbir bilgi vermedikleri için üretim kodunda çok faydalı olmaz.
Tanımlayıcılar, içerdikleri verilerle ilgili çok ayrıntılı olmamalıdır. Bunun nedeni, değerlerinin komut dosyalarının bu verilerle nasıl etkileşime geçtiğine veya gelecekteki bakım görevlilerinin verdiği kararlara bağlı olarak değişebilmesidir. Örneğin, başlangıçta miles
tanımlayıcısının verildiği bir değişkenin projenin ilerleyen aşamalarında kilometre cinsinden bir değere değiştirilmesi gerekebilir. Bu durumda, sonraki karışıklıklardan kaçınmak için bakım ekiplerinin bu değişkene yapılan tüm referansları değiştirmesi gerekir. Bunu önlemek için tanımlayıcı olarak distance
kullanın.
JavaScript, alt çizgi karakterleriyle (_
) başlayan tanımlayıcılara özel ayrıcalık veya anlam vermez. Ancak bu tanımlayıcıları genellikle bir değişkenin, yöntemin veya mülkün "özel" olduğunu göstermek için kullanır. Bu, değişkenin, yöntemin veya mülkün yalnızca kendisini içeren nesnenin bağlamında kullanılmasını amaçladığı ve bu bağlamın dışında erişilmemesi ya da değiştirilmemesi gerektiği anlamına gelir. Bu, diğer programlama dillerinden aktarılan ve JavaScript'in özel özelliklerinin eklenmesinden önce kullanılan bir kuraldır.
Değişken beyanı
JavaScript'i bir tanımlayıcıdan haberdar etmenin birden çok yolu vardır. Bu işleme "değişken tanımlama" denir. Değişkenler let
, const
veya var
anahtar kelimeleri kullanılarak tanımlanır.
let myVariable;
İstediğiniz zaman değiştirilebilecek bir değişken tanımlamak için let
veya var
kullanın. Bu anahtar kelimeler, JavaScript yorumlayıcısına bir karakter dizisinin değer içerebilecek bir tanımlayıcı olduğunu bildirir.
Modern bir kod tabanında çalışırken var
yerine let
kullanın. var
modern tarayıcılarda çalışmaya devam eder ancak JavaScript'in en eski sürümlerinde tanımlanan ve geriye dönük uyumluluğu korumak için daha sonra değiştirilemeyen bazı sezgisel olmayan davranışları vardır. let
, var
tasarımıyla ilgili bazı sorunları gidermek için ES6'ya eklendi.
Tanımlanmış bir değişken, değişkene bir değer atanarak başlatılır. Bir değişkene değer atamak veya yeniden atamak için tek eşittir işareti (=
) kullanın. Bunu, tanımlayan aynı ifadenin parçası olarak yapabilirsiniz:
let myVariable = 5;
myVariable + myVariable
> 10
Bir değişkeni hemen başlatmadan let
(veya var
) ile de tanımlayabilirsiniz. Bu durumda, kodunuz bir değer atayana kadar değişkenin ilk değeri undefined
olur.
let myVariable;
myVariable;
> undefined
myVariable = 5;
myVariable + myVariable
> 10
undefined
değeri olan bir değişken, henüz tanımlanmamış bir tanımlayıcıya sahip tanımsız değişkenden farklıdır. Tanımlamadığınız bir değişkene referans vermek hataya neden olur.
myVariable
> Uncaught ReferenceError: myVariable is not defined
let myVariable;
myVariable
> undefined
Bir tanımlayıcıyla değer ilişkilendirmesine genellikle "bağlama" denir.
let
, var
veya const
anahtar kelimelerini izleyen söz dizimi "bağlama listesi" olarak adlandırılır ve virgülle ayrılmış birden fazla değişken beyanı (beklenen noktalı virgülle biten) sağlar. Bu nedenle, aşağıdaki kod snippet'leri işlevsel olarak aynıdır:
let firstVariable,
secondVariable,
thirdVariable;
let firstVariable;
let secondVariable;
let thirdVariable;
JavaScript, değişkenin var olduğunu zaten bildiği için bir değişkenin değerini yeniden atarken let
(veya var
) kullanılmaz:
let myVariable = true;
myVariable
> true
myVariable = false;
myVariable
> false
Değişkenlere mevcut değerlerine göre yeni değerler atayabilirsiniz:
let myVariable = 10;
myVariable
> 10
myVariable = myVariable * myVariable;
myVariable
> 100
Bir değişkeni üretim ortamında let
kullanarak yeniden tanımlamaya çalışırsanız söz dizimi hatası alırsınız:
let myVariable = true;
let myVariable = false;
> Uncaught SyntaxError: redeclaration of let myVariable
Tarayıcıların geliştirici araçları, let
(ve class
) yeniden tanımlama konusunda daha esnek olduğundan geliştirici konsolunuzda aynı hatayı görmeyebilirsiniz.
Eski tarayıcı uyumluluğunu korumak için var
, herhangi bir bağlamda hatasız olarak gereksiz yeniden tanımlamaya izin verir:
var myVariable = true;
var myVariable = false;
myVariable\
> false
const
Bir sabit tanımlamak için const
anahtar kelimesini kullanın. Sabit, hemen başlatılması gereken ve daha sonra değiştirilemeyen bir değişken türüdür. Sabitler için tanımlayıcıların let
(ve var
) kullanılarak tanımlanan değişkenlerle aynı kurallara uyması gerekir:
const myConstant = true;
myConstant
> true
Sabitler oluşturulduktan sonra yeniden atanamayacağından, hemen bir değer atamadan sabit tanımlayamazsınız. Bu nedenle, ilk başlatılmamış sabitler sonsuza kadar undefined
olarak kalır. Bir sabit değeri başlatmadan tanımlamaya çalışırsanız söz dizimi hatası alırsınız:
const myConstant;
Uncaught SyntaxError: missing = in const declaration
const
ile tanımlanan bir değişkenin değerini, let
(veya var
) ile tanımlanan bir değişkenin değerini değiştirdiğiniz şekilde değiştirmeye çalışmak bir tür hatasına neden olur:
const myConstant = true;
myConstant = false;
> Uncaught TypeError: invalid assignment to const 'myConstant'
Ancak bir sabit bir nesneyle ilişkilendirildiğinde, söz konusu nesnenin özellikleri değiştirilebilir.
const constantObject = { "firstvalue" : true };
constantObject
> Object { firstvalue: true }
constantObject.secondvalue = false;
constantObject
> Object { firstvalue: true, secondvalue: false }
Bir nesneyi içeren sabit, değiştirilebilir bir veri değerine yönelik değişmez bir referanstır. Sabit değerin kendisi değiştirilemez ancak atıfta bulunulan nesnenin özellikleri değiştirilebilir, bunlara yeni özellikler eklenebilir veya mevcut özellikler kaldırılabilir:
const constantObject = { "firstvalue" : true };
constantObject = false
> Uncaught TypeError: invalid assignment to const 'constantObject'
Bir değişkenin yeniden atanmasını beklemiyorsanız bunu sabit değer haline getirmek en iyi uygulamadır. const
kullanmak, geliştirme ekibinize veya projenin gelecekteki bakımcılarına, kodunuzun nasıl kullanıldığıyla ilgili varsayımlarını (ör. bir değişkenin sonunda beklenen bir veri türüne göre değerlendirileceği) bozmamak için bu değeri değiştirmemelerini söyler.
Değişken kapsamı
Bir değişkenin kapsamı, komut dosyasının o değişkenin kullanılabildiği bölümüdür.
Değişkenin kapsamı dışında, undefined
değeri içeren bir tanımlayıcı olarak değil, tanımlanmamış gibi tanımlanmaz.
Bir değişkeni tanımlamak için kullandığınız anahtar kelimeye ve değişkeni tanımladığınız bağlama bağlı olarak, değişkenleri blok ifadeleri (blok kapsamı), tekil işlevler (işlev kapsamı) veya JavaScript uygulamasının tamamı (evrensel kapsam) için kapsamlandırabilirsiniz.
Engelleme kapsamı
let
veya const
kullanarak tanımladığınız tüm değişkenler, en yakın blok ifadesi içeren kapsama sahiptir. Bu, değişkene yalnızca ilgili blok içinden erişilebileceği anlamına gelir. Bir blok kapsamlı değişkene, kapsayıcı bloğunun dışından erişmeye çalışmak, var olmayan bir değişkene erişmeye çalışmakla aynı hataya neden olur:
{
let scopedVariable = true;
console.log( scopedVariable );
}
> true
scopedVariable
> ReferenceError: scopedVariable is not defined
JavaScript açısından, blok kapsamlı bir değişken, kendisini içeren bloğun dışında var olmaz. Örneğin, bir bloğun içinde bir sabit tanımlayabilir ve ardından bu bloğun dışında aynı tanımlayıcıyı kullanan başka bir sabit tanımlayabilirsiniz:
{
const myConstant = false;
}
const myConstant = true;
scopedConstant;
> true
Tanımlanmış bir değişken, ebeveyn bloğuna genişleyemez ancak tüm alt bloklar tarafından kullanıla bilir:
{
let scopedVariable = true;
{
console.log( scopedVariable );
}
}
> true
Tanımlanmış bir değişkenin değeri, alt öğe bloğu içinden değiştirilebilir:
{
let scopedVariable = false;
{
scopedVariable = true;
}
console.log( scopedVariable );
}
> true
Yeni bir değişken, üst bloktaki bir değişkenle aynı tanımlayıcıyı kullansa bile alt blok içinde let
veya const
ile hatasız bir şekilde başlatılabilir:
{
let scopedVariable = false;
{
let scopedVariable = true;
}
console.log( scopedVariable );
}
> false
İşlev Kapsamı
var
kullanılarak tanımlanan değişkenler, en yakın kapsayıcı işlevlerine (veya sınıf içindeki statik başlatma bloğuna) göre kapsamlandırılır.
function myFunction() {
var scopedVariable = true;
return scopedVariable;
}
scopedVariable;
> ReferenceError: scopedVariable is not defined
Bu durum, bir işlev çağrıldıktan sonra da geçerlidir. Değişken, işlev yürütülürken başlatılsa bile işlevin kapsamı dışında kullanılamaz:
function myFunction() {
var scopedVariable = true;
return scopedVariable;
}
scopedVariable;
> ReferenceError: scopedVariable is not defined
myFunction();
> true
scopedVariable;
> ReferenceError: scopedVariable is not defined
Genel kapsam
Genel değişkenler, tüm JavaScript uygulamalarında, tüm blok ve işlevlerin içinde, sayfadaki tüm komut dosyalarında kullanılabilir.
Bu, arzu edilen bir varsayılan ayar gibi görünse de uygulamanın herhangi bir bölümünün erişip değiştirebileceği değişkenler gereksiz yükü artırabilir ve hatta uygulamanın başka bir yerinde aynı tanımlayıcıya sahip değişkenlerle çakışmaya neden olabilir. Bu, üçüncü taraf kitaplıkları ve kullanıcı analizi gibi öğeler de dahil olmak üzere bir sayfanın oluşturulmasıyla ilgili tüm JavaScript'ler için geçerlidir. Bu nedenle, mümkün olduğunda global kapsamın kirlenmesini önlemek en iyi uygulamadır.
Üst işlevin dışında var
kullanılarak veya üst bloğun dışında let
ya da const
kullanılarak tanımlanan tüm değişkenler globaldir:
var functionGlobal = true; // Global
let blockGlobal = true; // Global
{
console.log( blockGlobal );
console.log( functionGlobal );
}
> true
> true
(function() {
console.log( blockGlobal );
console.log( functionGlobal );
}());
> true
> true
Bir değişkeni açıkça beyan etmeden (yani oluşturmak için hiçbir zaman var
, let
veya const
kullanmadan) bir değer atamak, bir işlev veya blok içinde başlatılmış olsa bile değişkeni global kapsama yükseltir. Bu kalıp kullanılarak oluşturulan bir değişkene bazen "dolaylı global" denir.
function myFunction() {
globalVariable = "global";
return globalVariable
}
myFunction()\
> "global"
globalVariable\
> "global"
Değişken Yükseltme
Değişkenler ve işlev tanımları, kapsamlarının en üstüne yükseltilir. Yani JavaScript yorumlayıcısı, bir komut dosyasının herhangi bir yerinde tanımlanan tüm değişkenleri işler ve komut dosyasını yürütmeden önce bunları kapsayıcı kapsamının ilk satırına etkili bir şekilde taşır. Bu, var
kullanılarak tanımlanan bir değişkene, değişken tanımlanmadan önce hatayla karşılaşmadan referans verilebileceği anlamına gelir:
hoistedVariable
> undefined
var hoistedVariable;
Yalnızca değişken beyanı barındırıldığı için, başlatma değil, var
, let
veya const
ile açıkça tanımlanmayan değişkenler kaldırılmaz:
unhoistedVariable;
> Uncaught ReferenceError: unhoistedVariable is not defined
unhoistedVariable = true;
Daha önce de belirtildiği gibi, tanımlanmış ancak başlatılmamış bir değişkene undefined
değeri atanır. Bu davranış, yalnızca var
kullanılarak tanımlanan yükseltilmiş değişken tanımları için geçerlidir.
hoistedVariable
> undefined
var hoistedVariable = 2 + 2;
hoistedVariable\
> 4
Sezgisel olmayan bu davranış, büyük ölçüde JavaScript'in en eski sürümlerinde alınan tasarım kararlarından kaynaklanır ve mevcut sitelerin çalışmasını bozma riski olmadan değiştirilemez.
let
ve const
, bir değişkene oluşturulmadan önce erişildiğinde hata atarak bu davranışı ele alır:
{
hoistedVariable;
let hoistedVariable;
}
> Uncaught ReferenceError: can't access lexical declaration 'hoistedVariable' before initialization
Bu hata, tanımlanmamış bir değişkene erişmeye çalışırken karşılaşabileceğiniz "hoistedVariable is not defined" (Yükseltilen değişken tanımlanmadı) hata mesajından farklıdır. JavaScript, değişkeni kaldırdığı için değişkenin belirli bir kapsamda oluşturulacağını bilir. Ancak yorumlayıcı, bu değişkeni bildirilmeden önce undefined
değeriyle kullanılabilir hale getirmek yerine hata verir.
let
veya const
(veya class
) ile tanımlanan değişkenlerin, kapsayıcı bloklarının başlangıcından değişkenin tanımlandığı kod noktasına kadar "zamansal ölü bölgede" ("TDZ") bulunduğu söylenir.
Zamansal ölü bölge, yazarlar için let
'ün davranışını var
'ten daha sezgisel hale getirir. const
'ün tasarımı için de kritik öneme sahiptir. Sabitler değiştirilemediğinden, kapsamının en üstüne kaldırılan ve undefined
değerinin atandığı bir sabit, anlamlı bir değerle başlatılamaz.
Öğrendiklerinizi test etme
Tanımlayıcıları hangi karakterlerle başlatabilirsiniz?
Değeri herhangi bir zamanda değiştirilebilen bir değişkeni tanımlamak için tercih edilen yöntem hangisi?