ECMAScript 2020

JavaScript 2020 dagi yangi xususiyatlar

Xususiyat	Tavsif
BigInt	JavaScript raqamida saqlash uchun juda katta qiymatlarni saqlaydi
String matchAll()	Satrdagi barcha mosliklarni qidiradi
Promise.allSettled()	Promiselarni kirish sifatida qabul qiladi va bitta Promise qaytaradi
Dynamic Import	JavaScript modullarini ish vaqtida yuklaydi
globalThis	Kod muhitidan mustaqil ravishda global obyektga murojaat qiladi
import.meta	Modul asosiy URL manzilini ko'rsatuvchi obyekt qaytaradi
Namespace Exports	Avval import qilmasdan moduldan to'liq nomlar fazosini eksport qiladi

2020 dagi yangi JavaScript operatorlari

Oper	Tavsif
??	Nullish coalescing — nullish bo'lmagan birinchi argumentni qaytaradi
?.	Optional chaining — obyekt undefined yoki null bo'lsa undefined qaytaradi
&&=	Mantiqiy AND tayinlash — birinchi qiymat true bo'lsa ikkinchi qiymatni tayinlaydi
||=	Mantiqiy OR tayinlash — birinchi qiymat false bo'lsa ikkinchi qiymatni tayinlaydi
??=	Nullish coalescing tayinlash — birinchi qiymat undefined yoki null bo'lsa ikkinchi qiymatni tayinlaydi

ECMAScript 2020 barcha zamonaviy brauzerlarda 2021-yil aprel dan beri qo'llab-quvvatlanadi.

---

JavaScript BigInt

JavaScript BigInt o'zgaruvchilari oddiy JavaScript Number da ifodalash uchun juda katta bo'lgan butun son qiymatlarini saqlash uchun ishlatiladi. JavaScript butun sonlari faqat taxminan 15 raqamgacha aniq.

let x = 999999999999999
let y = 9999999999999999 // juda katta

BigInt yaratish uchun butun son oxiriga n qo'shing yoki BigInt() ni chaqiring:

let x = 1234567890123456789012345n
let y = BigInt(1234567890123456789012345)

JavaScript BigInt ning typeof qiymati "bigint":

let x = BigInt(999999999999999)
let type = typeof x

---

JavaScript String matchAll()

ES2020 dan oldin satrdagi barcha mosliklarni qidirish uchun ishlatilishi mumkin bo'lgan satr metodi yo'q edi.

const iterator = text.matchAll('Cats')

Agar parametr regulyar ifoda bo'lsa, global flag (g) o'rnatilishi kerak, aks holda TypeError chiqariladi.

const iterator = text.matchAll(/Cats/g)

Katta-kichik harfni sezmaydigan qidirish uchun, sezmaydigan flag (i) o'rnatilishi kerak:

const iterator = text.matchAll(/Cats/gi)

---

Nullish Coalescing operatori (??)

?? operatori birinchi operand nullish bo'lmasa uni qaytaradi. Aks holda ikkinchisini qaytaradi. Nullish — null yoki undefined ni tavsiflovchi so'z.

?? operatori standart qiymatlarni taqdim etish uchun ishlatiladi va mantiqiy OR operatori || dan farq qiladi, chunki u faqat null va undefined ni "nullish" deb hisoblaydi va 0 yoki bo'sh satr kabi boshqa "falsy" qiymatlarni e'tiborsiz qoldiradi.

let name = null
let text = 'mavjud emas'
let result = name ?? text

---

Optional Chaining operatori (?.)

Optional Chaining operatori obyekt xususiyati undefined yoki null bo'lsa (xato chiqarish o'rniga) undefined qaytaradi.

const car = { type: 'Fiat', model: '500', color: 'white' }
let name = car?.name

Optional chaining faqat obyekt xususiyatlarida emas, balki funksiya chaqiruvlari va massivlarda ham ishlaydi.

Funksiya chaqiruvlari

Foydalanish holati	Sintaksis	Xulqi
Xavfsiz funksiya chaqiruv	obj.method?.()	Metod mavjud bo'lmasa undefined qaytaradi
Natijani boshqarish	let x = fn?.()	fn mavjud bo'lmasa x undefined bo'ladi

Massivlar

Foydalanish holati	Sintaksis	Qaytaradi
Xavfsiz element kirish	arr?.[2]	arr null yoki undefined bo'lsa undefined
Elementda xavfsiz xususiyat	arr?.[1]?.name	Xavfsiz undefined qaytaradi
Xavfsiz metod chaqiruv	arr?.map(fn)	arr mavjud bo'lmasa undefined qaytaradi
Standart qiymat	arr?.[0] ?? 'N/A'	arr yoki element mavjud bo'lmasa "N/A" qaytaradi

---

&&= operatori

Mantiqiy AND tayinlash operatori ikki qiymat o'rtasida ishlatiladi. Agar birinchi qiymat true bo'lsa, ikkinchi qiymat tayinlanadi.

let x = 10
x &&= 5

---

||= operatori

Mantiqiy OR tayinlash operatori ikki qiymat o'rtasida ishlatiladi. Agar birinchi qiymat false bo'lsa, ikkinchi qiymat tayinlanadi.

let x = 10
x ||= 5

---

??= operatori

Nullish Coalescing tayinlash operatori ikki qiymat o'rtasida ishlatiladi. Agar birinchi qiymat undefined yoki null bo'lsa, ikkinchi qiymat tayinlanadi.

let x
x ??= 10

---

JavaScript Promise.allSettled()

Promise.allSettled() metodi promiselar ro'yxatidan bitta Promise qaytaradi.

const myPromise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 200, 'King')
})

const myPromise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'Queen')
})

Promise.allSettled([myPromise1, myPromise2]).then((results) =>
  results.forEach((x) => myDisplay(x.status))
)

Eslatma

Promise.allSettled() "Barcha promiselarni ishga tushir. Men natijalar haqida qayg'urmayman" degan ma'noni anglatadi.

---

JavaScript Dynamic Import

Dynamic Import — bu JavaScript modullarini dasturingiz boshida emas, ish vaqtida yuklash usuli.

import('./module.js')

Statik importlardan farqli o'laroq (faylning yuqori qismida bo'lishi kerak), dinamik importlar istalgan joyda — funksiyalar, shartlar, hodisa ishlovchilari ichida ishlatilishi mumkin.

Turi	Misol	Qachon yuklanadi
Statik	import { add } from './math.js'	Yuklash vaqtida
Dinamik	const math = await import('./math.js')	Kerak bo'lganda

---

JavaScript globalThis

globalThis kodingiz ishlaydigan muhitdan qat'i nazar global obyektga kirishning standart usulini taqdim etadi.

Global obyekt JavaScript muhitidagi eng yuqori darajadagi obyekt:

• Brauzerlarda u window
• Node.js da u global
• Web Worker larda u self

globalThis === window // brauzerlarda true
globalThis === global // Node.js da true

---

JavaScript import.meta

import.meta modul asosiy URL manzilini o'z ichiga olgan obyekt qaytaradi.

const myObject = import.meta

---

Modul nomlar fazosi eksportlari

Modul nomlar fazosi eksportlari bilan siz avval import qilmasdan o'z modulingizdan butun nomlar fazosini qayta eksport qilishingiz mumkin.

// Oldin:
export * from './utils.js'
import { add } from './math.js'

// Hozir:
export * as utils from './utils.js'
import { utils } from './math.js'