Modern JavaScript: ES2024 ile Gelen Yeni Özellikler

JavaScript sürekli evrilen bir dil. Her yıl TC39 komitesi yeni özellikler ekliyor ve hayatımızı kolaylaştırıyor. ES2024 ile gelen en kullanışlı özellikleri inceleyelim.

1. Object.groupBy()

Array elemanlarını bir kritere göre gruplamak artık tek satır:

const users = [
    { name: "Ali", age: 25, city: "İstanbul" },
    { name: "Ayşe", age: 30, city: "Ankara" },
    { name: "Mehmet", age: 25, city: "İstanbul" },
    { name: "Fatma", age: 35, city: "Ankara" }
];

const byCity = Object.groupBy(users, user => user.city);
// {
//   "İstanbul": [{Ali...}, {Mehmet...}],
//   "Ankara": [{Ayşe...}, {Fatma...}]
// }

2. Promise.withResolvers()

Promise dışından resolve/reject etmek için artık kolay bir yöntem var:

// Eski yol
let resolve, reject;
const promise = new Promise((res, rej) => {
    resolve = res;
    reject = rej;
});

// Yeni yol
const { promise, resolve, reject } = Promise.withResolvers();

// Bir yerde
button.onclick = () => resolve("Tıklandı!");

// Başka yerde
const result = await promise;

3. Array.fromAsync()

Async iterable’lardan array oluşturmak:

async function* fetchPages() {
    yield await fetch("/api/page/1").then(r => r.json());
    yield await fetch("/api/page/2").then(r => r.json());
    yield await fetch("/api/page/3").then(r => r.json());
}

// Önce: manuel for-await-of
const pages = [];
for await (const page of fetchPages()) {
    pages.push(page);
}

// Sonra: tek satır
const pages = await Array.fromAsync(fetchPages());

4. String.prototype.isWellFormed()

UTF-16 encoding problemlerini yakalamak:

const bad = "uD800"; // tek başına surrogate
bad.isWellFormed(); // false

const good = "merhaba";
good.isWellFormed(); // true

// Düzeltme
const fixed = bad.toWellFormed(); // replacement char ile değiştirir

5. RegExp v Flag

Daha güçlü Unicode regex:

// Eski u flag
const regex1 = /p{Script=Latin}/u;

// Yeni v flag — set operations destekler
const regex2 = /[p{Script=Latin}--p{Letter}]/v;
// Latin script'inde olan ama harf olmayan karakterler

6. Top-level await (Modüllerde)

Artık await’i async function olmadan modül seviyesinde kullanabilirsiniz:

// config.mjs
const response = await fetch("/api/config");
export const config = await response.json();

// main.mjs
import { config } from "./config.mjs";
console.log(config); // Hazır!

Bonus: AbortSignal.any()

Birden fazla AbortSignal’i tek bir signal’de birleştirme:

const userAbort = new AbortController();
const timeoutSignal = AbortSignal.timeout(5000);

// Herhangi biri tetiklendiğinde iptal et
const combined = AbortSignal.any([
    userAbort.signal,
    timeoutSignal
]);

fetch("/api/data", { signal: combined });

Tarayıcı Desteği

Bu özelliklerin çoğu modern tarayıcılarda (2024+ sürümlerinde) destekleniyor. Eski tarayıcı desteği gerekiyorsa Babel ile polyfill’leyebilirsiniz.

Sonuç

JavaScript artık çok daha “kullanışlı”. Object.groupBy ve Promise.withResolvers kişisel favorilerim — günlük geliştirmede sürekli ihtiyaç duyduğum şeyler.

Hangileri size en faydalı geldi?

Yorum bırakın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Scroll to Top