Uygulamamızdan örnek JavaScript kartları

Daha fazla ücretsiz kart almak için uygulamamızı App Store veya Google Play'den indirin veya tüm kartlara erişim için abone olun.

JavaScript'te leksiksel kapsam nedir?

JavaScript'taki leksikal kapsam, bir değişkenin görünürlük aralığının kodda bulunduğu konuma göre belirlendiği bir ilkedir. Bu, değişkenlerin tanımlandıkları blok içerisinde, ayrıca herhangi bir iç içe geçmiş blokta erişilebilir olduğu anlamına gelir. Bu, kapanışların oluşturulmasını ve değişken erişimi üzerinde kontrol sağlar. JavaScript kodunda leksikal kapsamın kullanılmasının bir örneği:

function outerFunction() {
  let outerVariable = `I'm outside!`;

  function innerFunction() {
    console.log(outerVariable); // 'outerVariable'e erişimı vardır
  }

  innerFunction();
}
outerFunction(); // `I'm outside!` şeklinde görüntülenir

Leksikal kapsam, bir iç işlevin, dış işlevin tamamlandıktan sonra dahi dış işlevde tanımlanan değişkenlere erişmesine olanak sağlar. Bu, JavaScript'teki kapanışları oluşturmak için kilit bir unsurdur ve uygulamalardaki durum yönetiminin daha esnek olmasını sağlar.

Hoisting nedir?

JavaScript dilinde Hoisting, değişkenlerin ve fonksiyonların kod çalıştırılmadan önce kapsamlarının en üstüne taşındığı bir mekanizmadır. Pratikte, bu fonksiyonları veya değişkenleri aslında bildirilmeden önce kullanabileceğimiz anlamına gelir.

Ancak, hoistingin değişkenler ve fonksiyonlar için biraz farklı çalıştığını belirtmek gerekir.

var anahtar sözcüğü ile bildirilen değişkenler için, yalnızca bildirim hoisting edilir, başlatma değil. Bildirimden önce başlatılan değişkenler tanımlanmamış olarak döner.

Değişkenler için hoisting kodunun bir örneği:

console.log(myVar); // tanımsız
var myVar = 5;
console.log(myVar); // 5

Fonksiyonlar için, hoisting hem fonksiyonun bildirimini hem de tanımını en üste taşır, bu da fonksiyonun bildirilmeden önce kullanılmasını sağlar.

Fonksiyonlar için hoisting kodunun bir örneği:

console.log(myFunction()); // "Merhaba Dünya"

function myFunction() {
  return "Merhaba Dünya";
}

Hoisting, let ve const ile bildirilen değişkenler için meydana gelmez.

Bir ok fonksiyonu nedir ve avantajları nelerdir?

Ok işlevi, ayrıca ok işlevi olarak bilinen, ECMAScript 6'da (ES6) tanıtılan bir tür işlevdir. Onlara ok işlevleri denir çünkü işlevi tanımlamak için bir ok ( => ) ile özel bir sözdizimi kullanırlar.

Karşılaştırma için, geleneksel bir işlev şu şekilde görünebilir:

function sum(a, b) {
  return a + b;
}

Ok işlevi olarak eşdeğeri şu şekildedir:

const sum = (a, b) => a + b;

Ok işlevinin başlıca faydası, kendi yürütme bağlamını ( bu'na bağlama ) oluşturmamasıdır ki bu, JavaScript'te genellikle hataların bir kaynağıdır. Ok işlevlerinde, bu, çevreleyen bağlamdan miras alınır. Başka bir avantajı, sözdiziminin özlülüğüdür, özellikle işlevlerin diğer işlevlere argüman olarak kullanıldığı durumlarda, örneğin yüksek düzeyli işlevlerde, çok kullanışlıdır.

Ancak, kendi bu'nun eksikliği nedeniyle, ok işlevleri, yapılandırıcı (yaratıcı) nesneleri tanımlamak veya prototype nesnelerinde yöntemler oluşturmak için uygun değildir.

Bir Promise nesnesi nedir ve nasıl kullanılır?

JavaScript'teki Promise nesnesi, asenkron işlemleri işlemek için kullanılır. Bir Promise, oluşturulduğu sırada mevcut olmayan ancak gelecekte veya hiç olmayabilecek bir değeri temsil eder.

Bir Promise nesnesi üç durumdan birinde olabilir:
1. Beklemekte - işlem hala devam ediyor, ne başarılı ne de hatalarla tamamlanmıştır.
2. Yerine Getirildi - işlem başarıyla tamamlandı, Promise bir değer döndürdü.
3. Reddedildi - işlem bir hata ile tamamlandı, Promise hatanın nedenini döndürdü.

Yerine getirilmiş veya reddedilmiş bir Promise "yerleşmiş" olarak kabul edilir ve durumunu asla değiştirmez.

Promise nesnesi oluşturmak:

const promise = new Promise((resolve, reject) => {
  const success = true;
  if (success) {
    resolve('İşlem başarılı.');
  } else {
    reject('İşlem başarısız.');
  }
});

Bir Promise nesnesini kullanmak:

promise
  .then(result => {
    console.log(result); // 'İşlem başarılı.' basar.
  })
  .catch(error => {
    console.log(error);
  });

.then() metodu, Promise'ın yerine getirildiğinde ve .catch() reddedildiğinde gerçekleştirilir. Her iki durumda da, işlemin sonucu veya Promise'ın reddinin nedeni bir argüman olarak geçilir.

Bir geri çağırma (callback) nedir?

Bir geri çağrı, ayrıca bir geri çağrı işlevi olarak da adlandırılan, başka bir işleve argüman olarak geçirilen ve daha sonra bu işlevin tamamlanmasından sonra gerçekleştirilen (geri çağrılan) bir işlevdir. Geri çağrı işlevleri, özellikle AJAX istekleri veya olay işleme gibi asenkron işlemlerde JavaScript'te yaygın olarak kullanılır.

Geri çağrı işlevleri genellikle belirli bir operasyonun sonuçlarını argüman olarak alır, böylece bu sonuçların işlenmesi veya analiz edilmesi için kullanılabilirler.

Uygulamada bu tür bir işlevin kullanımı aşağıdaki gibi görünebilir:

function executeAfterTimeout(callback, timeout) {
  setTimeout(() => {
    console.log('Time passed!');
    callback();
  }, timeout);
}

executeAfterTimeout(() => {
  console.log('This is a callback!');
}, 2000);

Bu durumda, `executeAfterTimeout` işlevi parametre olarak bir `callback` işlevi alır, bu da belirli bir miktar zaman geçtikten sonra gerçekleştirilecektir. Geri çağrı işlevleri, JavaScript'teki asenkron kontrol akışını yönetmek için son derece faydalıdır.

Boş birleştirme operatörü nedir ve nasıl çalışır?

Nullish Birleştirme Operatörü (??), sol tarafı null veya tanımlanmamış olduğunda operasyonun sağ tarafını döndüren mantıksal bir operatördür. Yani, bir değişken boş olduğunda, nullish birleştirme operatörü tanımlanmış değeri sonuç olarak döndürür.

Temel gösterim şu şekildedir:

let değer = null ?? 'varsayılan değer';

Bu durumda, sol taraf (değer) null olduğundan, sonuç 'varsayılan değer'dir. Ek olarak, bu operatör OR operatöründen (||) farklıdır, çünkü OR fonksiyonu sol tarafı yanlış olduğunda (yanlış, 0, '', null, tanımsız, NaN) sağ tarafı getirirken, nullish birleştirme operatörü sadece sol tarafı null veya tanımsız olduğunda sağ tarafı döndürür.

OR ile örnek:

let değer1 = 0 || 'varsayılan';
console.log(değer1); // çıktı: 'varsayılan' çünkü 0 yanlış bir değerdir

Nullish birleştirme ile örnek:

let değer2 = 0 ?? 'varsayılan';
console.log(değer2); // çıktı: 0 çünkü 0 null veya tanımlanmamış değildir

Dolayısıyla, OR'un aksine, nullish birleştirme operatörü 0, '' ve NaN'ı "boş" değerler olarak kabul etmez.

Symbol nedir ve ne zaman kullanılmalıdır?

JavaScript'teki Symbol, genellikle nesnelerin benzersiz özelliklerini belirlemek için kullanılan benzersiz ve değişmez bir veri tipidir.

Symbol() yapıcısını çağırarak bir Symbol oluşturabilirsiniz, bu her çağrıldığında benzersiz bir sembol oluşturur. Aynı argümanla Symbol() yapıcısını bile çağırsak, her oluşturulan sembol farklı olacaktır.

const symbol1 = Symbol('mySymbol');
const symbol2 = Symbol('mySymbol');
console.log(symbol1 === symbol2); // false döndürür

Symbol, genellikle nesnelerin (benzersiz) özelliklerini tanımlamak için kullanılır, özellikle bu özelliğin gizli veya özel olmasını istediğimizde. Ayrıca for...in veya for...of kullanılarak nesneler üzerinde döngü yapıldığında dikkate alınmayan ve Object.keys() yöntemi tarafından döndürülmeyen özellikleri de kapsar. Ayrıca, semboller "sözde" özel özellikler oluşturmayı sağlar.

let obj = {};
let privateProperty = Symbol('private');

obj[privateProperty] = 'Bu özel';

console.log(obj[privateProperty]); // 'Bu özel'
console.log(Object.keys(obj)); // []

Symbol'ü ne zaman kullanacağımız konusunda kesin bir kural yoktur. Genellikle, kolayca görülemeyen veya değiştirilemeyen benzersiz bir özellik oluşturmak veya nesnelerin düşük seviyede davranışını etkileyen metotları tanımlamak istediğimizde kullanılırlar.

WeakMap ve WeakSet nedir?

WeakMap ve WeakSet, JavaScript Map ve Set nesnelerinin, Çöp Toplayıcısı tarafından otomatik bellek serbest bırakmasını engellemeyen özel versiyonlarıdır.

WeakMap, anahtarların nesneler olması ve değerlerin herhangi bir şey olabileceği anahtar-değer çiftlerinin bir koleksiyonudur. Map ve WeakMap arasındaki ana fark, WeakMap'taki anahtarların "zayıf" bir şekilde tutulmasıdır, yani anahtar nesnesine başka bir referans yoksa, çöp toplanacak ve WeakMap'teki girişi otomatik olarak kaldırılacaktır.

WeakMap kullanmanın bir örneği aşağıdaki gibidir:

let john = { name: "John" };

let weakMap = new WeakMap();
weakMap.set(john, "...");

john = null; // referansı değiştir

// john bellekten kaldırıldı!

WeakSet, WeakMap'ın Map'e karşı olduğu gibi benzerdir. Bir nesneler setidir, ancak nesne başka hiçbir yerde görünmüyorsa, çöp toplanmasına engel olmaz. Tipik Set metodlarına `size` ve `clear` gibi sahip değildir ve `add` metodu sadece nesneler alır.

WeakSet kullanma örneği:

let john = { name: "John" };

let weakSet = new WeakSet();
weakSet.add(john);

john = null; // referansı değiştir

// john bellekten kaldırıldı!

WeakMap ve WeakSet ikisi de, genellikle nesne kendisi kaldırıldığında kaldırılması gereken nesneler hakkında ek bilgi depolamak istediğimiz durumlarda kullanılır.

JavaScript Kartları