JavaScript, modern web uygulamalarının temel yapı taşlarından biridir ve günümüzde tüm geliştiricilerin başvurduğu dillerden biri olmuştur. Ancak, JavaScript’i derinlemesine bildiğinizi mi düşünüyorsunuz? Ya da sadece temel özelliklere hakim misiniz? JavaScript, sadece başlangıç seviyesindeki komutlardan çok daha fazlasını sunar. Aslında, bilmediğiniz bazı "gizli" özellikler ve ipuçları, kod yazma becerilerinizi büyük ölçüde iyileştirebilir.
Bugün, bu yazımızda JavaScript’in en ilginç ve etkileyici özelliklerinden bazılarına göz atacağız. Hadi, derinlemesine keşfe çıkalım!
1. Değişkenler ve Sabitler Arasındaki Farkları İyi Kavrayın
JavaScript’te `let`, `const` ve `var` kullanarak değişkenler tanımlamak oldukça yaygın bir durumdur, ancak her birinin kullanım amacını anlamak gerçekten önemlidir. `let` ve `const` daha modern ve güvenli seçenekler sunarken, `var` eski ve bazen kafa karıştırıcı olabilir.
let sayi = 10;
const sabitDeger = 20;
Örnek:
const kullanici = { ad: 'Ali', yas: 25, meslek: 'Developer' };
const { ad, yas } = kullanici;
console.log(ad, yas);
Bu şekilde, nesneden sadece ihtiyacınız olan değerleri kolayca alabilirsiniz.
3. Spread Operator (Yayılma Operatörü) ile Nesne veya Dizi Kopyalama
Spread operatörü, JavaScript’te nesne veya dizilerin kopyalanmasını ve birleştirilmesini çok daha kolay hale getirir. Bu özellik, özellikle mutasyonlardan kaçınarak kodunuzu daha güvenli hale getirmek için harika bir tekniktir.
const eskiDizi = [1, 2, 3];
const yeniDizi = [...eskiDizi, 4, 5];
console.log(yeniDizi);
Bu sayede orijinal diziyi değiştirmeden yeni bir dizi oluşturabilirsiniz.
4. IIFE (Immediately Invoked Function Expression) Kullanımı
IIFE, bir fonksiyonun hemen tanımlanıp çalıştırılmasını sağlayan bir tekniktir. Genellikle kodunuzu izole etmek ve global alanda kirlilik yaratmamak için kullanılır. Özellikle kütüphaneler yazarken ya da JavaScript'i daha modüler hale getirmekte faydalıdır.
(function() {
let gizliDeger = 'Bu bir IIFE örneğidir';
console.log(gizliDeger);
})();
Bu fonksiyon hemen çalışır ve dış dünyaya erişemez.
Örnek:
async function veriAl() {
let response = await fetch('https://jsonplaceholder.typicode.com/posts');
let veri = await response.json();
console.log(veri);
}
veriAl();
Bu şekilde, asenkron kodları daha temiz bir şekilde yazabilirsiniz.
Örnek:
document.querySelector('#container').addEventListener('click', function(event) {
if(event.target && event.target.matches('button.class')) {
console.log('Button clicked!');
}
});
Bu sayede sayfadaki her bir öğe için ayrı ayrı dinleyici eklemeden, yalnızca üst öğe üzerinde işlemler gerçekleştirebilirsiniz.
7. Promise.all ile Birden Fazla Asenkron Görevi Aynı Anda Çalıştırın
Birden fazla asenkron işlem yapmanız gerektiğinde, `Promise.all` kullanarak tüm işlemleri aynı anda başlatabilir ve hepsinin tamamlanmasını bekleyebilirsiniz. Bu, özellikle API'lerden veri alırken veya dosya işlemleri yaparken oldukça kullanışlıdır.
Promise.all([fetch('url1'), fetch('url2')])
.then(responses => Promise.all(responses.map(response => response.json())))
.then(data => console.log(data));
Bu, tüm API isteklerini paralel olarak gerçekleştirmenizi sağlar.
