ES11 nedir? ECMAScript 2020 nedir?

ECMAscript, k/ecmascript-nedir-ecmascript-ne-degildir-bilinmesi-gerekenlerısa adıyla ES, Ecma-International tarafından ECMA-262 dokümanında yayınlanan ve her yıl yenilenen JavaScript standartıdır. Asıl amacı javascript için bir standart geliştirerek tüm tarayıcılarda çalışabilen kodlar yazılmasına olanak vermektir. (Ah neydi o Internet Explorer günleri, her browsera ayrı kod yazardık) Bununla birlikte Node.Js gibi sunucu tabanlı motorlarda ECMAScript’le uyum göstermektedir.

Aslında ES6, ES7 … ES11, ES12 gibi farklı versiyonlar yok. ECMAScript her sürümde üstüne koyarak ilerliyor. Her sürüm bir önceki sürümü kapsarken yenilikleri de beraberinde getiriyor. Bazı iş ilanlarında “ES6+ bilmelisiniz” şeklinde verilen şart bu açıdan oldukça garip. Sadece ES6 bilmenizi isteseler, “sonrasını bilmeseniz de olur, bize ES6 lazım” şeklinde açıklanabilir, fakat ES6+ ne demek ben anlamıyorum. 🙂 ( Es.Next yazsalar daha doğru olacak)

ES11 (ESCMAScript 2020) Haziran 2020’de yayınlanan 11. ECMAScript sürümüdür.

ES 11 ile yeni neler geldi?

ES11 ile birlikte Javascript’e aşağıdaki yenilikler geldi.

Exporting modules
Optional chaining
Nullish Coalescing Operator
Promise.Allsettled
matchAll

Exporting modules

ES11’le birlikte modülleri importa benzer şekilde export edebiliyoruz.

export * as MyComponent from './Component.js'

Optional Chaining

Optional chaining bir nesnenin alt nesneleri için mantıksal ifadeler kullanmadan, varsa değerini, yoksa undefined değerini atamamıza yardımcı oluyor.

let building = { room1: { window1 : { color : red } } };

yukarıdaki gibi bir nesnemiz olsun.

Bu nesnedeki bir değer, örneğin building.room2.window1.color şeklinde ulaşmaya çalışırsak 'TypeError: Cannot read property 'color' of undefined şeklinde bir hatayla karşılaşırız. ES11 öncesi bunu önlemek için de genellikle aşağıdaki gibi bir kod yazardık.

if ( (building)
    && (building.room2)
        && (building.room2.window1)
            && (building.room2.window1.color) {
                console.log("The color of the windows is "+ building.room2.windows1.color)
            }
    else {
       console.log("Window, Room or building not found")
    }

Yazması ve okuması oldukça güç bir kod değil mi? ES11 ile birlikt ebu kodu aşağıdaki gibi yazabiliriz.

let color = building?.room2?.window1?.color;
if (color) {
   console.log("The color of the windows is "+ building.room2.windows1.color)
} else {
   console.log("Window, Room or building not found")
}

Nullish Coalescing Operator

ES11 öncesinde mantıksal ifadelerde null, undefined, NaN, fales ve hatta 0 deperleri false değerine karşılık geliyordu. ES11 ile birlikte eklenen ?? operatörü ile sadece “null” veya “undefined” değerlerini false olarak nitelendirebiliyoruz.

let name = undefined || "John Doe"
let name = NaN || "John Doe"
let name = 0 || "John Doe"

// Bunların tümünde name değişkeni "John Doe" değerini alır.



let name = undefined ?? "John Doe"
let name = null ?? "John Doe"
let name = NaN ?? "John Doe"
let name = 0 ?? "John Doe"

/*
 * İlk ikisinde sağ operatörün sağ tarafı yani "John Doe" alınırken. 3 ve 4. satırlarda sol
 * taraf true kabul edilerek name değişkenine NaN ve 0 değerleri atanır.
*/

Promise.AllSettled

Promise.AllSettled özelliği bir dizideki tüm array’lerin çözümlenmesini bekleyen koşullu bir çalıştırma yapmanızı sağlar.

const promisesArray = [
    Promise.resolve(firstPromise),
    Promise.resolve(secvondPromise)
]

Promise.AllSettled(promisesArray).then ((result) => {
   // Tüm promiseler çözümlendikten sonra çalışacak kod
})

ES12 ile birlikt egelen Promise.Any metodunu da incelemenizi öneririm.

matchAll

matchAll metodu bir string içerisinde yapacağınız regex aramalarını detaylandırmanızı sağlayan bir metod. Örnek kod ve çıktısı ile daha iyi anlaşılacaktır.

const regex = /[1-3]/g;
const year = '1983';
for (const match of year.matchAll(regex)) {
   console.log(match)
}

/*  Bu kodun çıktısı aşağıdaki gibi olacaktır
 *
 *  ['1', index: 0, input: '1983', groups: undefined]
 *  ['3', index: 3, input: '1983', groups: undefined]
 *
*/