ES15 nedir? ECMAScript 2024 nedir?

ECMAscript, kısa adıyla ES, Ecma-International tarafından ECMA-262 dokümanında yayınlanan ve her yıl yenilenen JavaScript standardıdır. Bu yazıda ECMAScript 2024 (ES15) sürümüyle gelen yenilikleri inceliyoruz.

ES15 (ECMAScript 2024), 2024 yılında yayınlanan 15. ECMAScript sürümüdür.

ES15 ile gelen yenilikler

ES15 ile birlikte tanımlanan yeni özellikler şunlar;

• Object.groupBy() ve Map.groupBy() (Gruplama metotları)
• Promise.withResolvers() (Kestirme Promise oluşturucu)
• ArrayBuffer resize ve transfer özellikleri
• String.prototype.isWellFormed() / toWellFormed() (Unicode format kontrolleri)
• RegExp v bayrağı (unicodeSets)
• Atomics.waitAsync() (Asenkron atomik bekletme)

Object.groupBy() ve Map.groupBy()

Bir dizideki veya koleksiyondaki verileri belirli bir kritere göre gruplamak yazılımda çok sık ihtiyaç duyduğumuz bir işlemdir. Geleneksel olarak bunu reduce metotlarıyla veya dış kütüphanelerle (Lodash vb.) yapıyorduk. ES15 ile gelen Object.groupBy() ve Map.groupBy() statik metotları sayesinde bunu artık yerleşik olarak yapabiliyoruz.

const inventory = [
  { name: "Elma", type: "meyve", quantity: 5 },
  { name: "Ispanak", type: "sebze", quantity: 2 },
  { name: "Muz", type: "meyve", quantity: 12 },
  { name: "Kiraz", type: "meyve", quantity: 0 }
];

// Meyve ve sebze tiplerine göre gruplayalım
const result = Object.groupBy(inventory, ({ type }) => type);
console.log(result);
/* Çıktı:
{
  meyve: [
    { name: "Elma", type: "meyve", quantity: 5 },
    { name: "Muz", type: "meyve", quantity: 12 },
    { name: "Kiraz", type: "meyve", quantity: 0 }
  ],
  sebze: [
    { name: "Ispanak", type: "sebze", quantity: 2 }
  ]
}
*/

Promise.withResolvers()

Bazen bir Promise oluştururken, o Promise'in resolve veya reject fonksiyonlarını dışarıdan (Promise dışındaki bir kapsamdan/scope'tan) çağırmak isteriz. ES15 ile gelen Promise.withResolvers() metodu; bir Promise nesnesini, onun resolve ve reject tetikleyicileriyle birlikte tek bir nesne olarak bize döner.

// ES15 öncesi
let resolveFn, rejectFn;
const oldPromise = new Promise((resolve, reject) => {
    resolveFn = resolve;
    rejectFn = reject;
});

// ES15 sonrası (Kısa ve temiz)
const { promise, resolve, reject } = Promise.withResolvers();

// Dışarıdan tetikleyebiliyoruz
setTimeout(() => resolve("İşlem başarıyla tamamlandı!"), 1000);

const data = await promise;
console.log(data); // "İşlem başarıyla tamamlandı!"

ArrayBuffer Yenilikleri (Resize ve Transfer)

Düşük seviyeli veri işlemleri (örneğin WebGL, WebAssembly veya ses/video buffer işlemleri) gerçekleştiren geliştiriciler için ArrayBuffer boyutlandırma yetenekleri eklendi. Artık bir ArrayBuffer nesnesinin maksimum boyutunu baştan belirleyerek çalışma zamanında boyutunu değiştirebiliyor (resize()) ya da veriyi kopyalamadan başka bir buffer'a aktarabiliyoruz (transfer()).

const buffer = new ArrayBuffer(8, { maxByteLength: 16 });
console.log(buffer.byteLength); // 8

// Buffer'ı yeniden boyutlandıralım
buffer.resize(12);
console.log(buffer.byteLength); // 12

isWellFormed() ve toWellFormed() Metotları

JavaScript, dize (string) karakterlerini UTF-16 kod üniteleri olarak temsil eder. Bazen düzgün oluşturulmamış (eksik veya hatalı eşleşen) surrogate çiftleri (surrogate pairs) içeren metinler hatalara neden olur. isWellFormed() metodu dizedeki UTF-16 surrogate çiftlerinin düzgün biçimlendirilip biçimlendirilmediğini kontrol eder. toWellFormed() ise hatalı karakterleri güvenli Unicode yerine koyma karakteri (U+FFFD) ile değiştirerek temiz bir dize üretir.

const invalidString = "ab\uD800c"; // Yarım kalmış surrogate karakter

console.log(invalidString.isWellFormed()); // false
console.log(invalidString.toWellFormed()); // "abc" (Temizlenmiş)

RegExp v Bayrağı (unicodeSets)

Düzenli ifadelerdeki eski /u (unicode) bayrağının yerini alan /v (unicodeSets) bayrağı, Unicode karakter kümeleri üzerinde kesişim, çıkarma ve fark gibi küme işlemlerini doğrudan Regex içerisinde yapabilmemize olanak tanır.

// Sadece temel Latin alfabesi harflerini eşleştiren ancak sesli harfleri hariç tutan regex
// [a-z--[aeiou]]
const regex = /[a-z--[aeiou]]/v;
console.log(regex.test('b')); // true
console.log(regex.test('a')); // false (Hariç tutuldu)

Atomics.waitAsync()

Çoklu iş parçacıklı (multithreaded) yapılarda (Web Workers), paylaşımlı bellek (SharedArrayBuffer) üzerindeki verileri asenkron ve bloklamayan (non-blocking) bir şekilde beklemek için Atomics.waitAsync() metodu eklenmiştir. Bu sayede ana iş parçacığı (main thread) bloke olmadan paylaşılan bellek güncellemelerini bekleyebilir.

const sab = new SharedArrayBuffer(1024);
const int32 = new Int32Array(sab);

// int32 dizisinin 0. indeksinin değeri 0 olduğu sürece asenkron bekle
Atomics.waitAsync(int32, 0, 0).value.then(result => {
    console.log("Paylaşımlı bellek güncellendi!", result);
});