MohirDox

Ko'rinishi

JavaScript 2015 (ES6) ​

ECMAScript 2015

JavaScript ga ikkinchi asosiy qayta ko'rish.

ECMAScript 2015 ES6 nomi bilan ham taniladi.

JavaScript 2015 (ES6) dagi yangi xususiyatlar ​

XususiyatTavsif
let kalit so'ziBlok doirasiga ega o'zgaruvchi e'lon qiladi
const kalit so'ziO'zgarmas doimiy o'zgaruvchi e'lon qiladi
Arrow funksiyalarFunksiya ifodalarini qisqa sintaksis bilan yozishga imkon beradi
{a,b} = operatoriObyekt xususiyatlarini o'zgaruvchilarga tayinlaydi (obyekt destruktizatsiyasi)
[a,b] = operatoriMassiv qiymatlarini o'zgaruvchilarga tayinlaydi (massiv destruktizatsiyasi)
... operatoriMassiv yoki iterablni alohida elementlarga yoyadi
for/ofIterabl obyektlar qiymatlari bo'ylab aylanadi
Map obyektlarKalit-qiymat juftlariga ega obyekt
Set obyektlarNoyob qiymatlarni saqlaydigan massiv
KlasslarJavaScript obyektlari uchun shablonlar
PromiselarAsinxron operatsiyaning bajarilishi yoki muvaffaqiyatsizligini ifodalovchi obyekt
SymbolHech qanday kod tasodifan kira olmaydigan noyob "yashirin" identifikator
Standart parametrlarFunksiya parametrlari uchun standart qiymatlarga ruxsat beradi
Rest parametrFunksiyalarga noaniq sonli argumentlarni qabul qilishga ruxsat beradi
String.includes()Satr belgilangan qiymatni o'z ichiga olsa true qaytaradi
String.startsWith()Satr belgilangan qiymat bilan boshlansa true qaytaradi
String.endsWith()Satr belgilangan qiymat bilan tugasa true qaytaradi
Array entries()Massivdan kalit/qiymat juftlari iteratorini qaytaradi
Array.from()Satrdan massiv yaratadi
Array keys()Massiv kalitlari bilan iteratorni qaytaradi
Array find()Testdan o'tgan birinchi element qiymatini qaytaradi
Array findIndex()Testdan o'tgan birinchi element indeksini qaytaradi
Object.assign()Manba obyektdan maqsad obyektga xususiyatlarni ko'chiradi
RegExp /uRegulyar ifodada to'liq Unicode qo'llab-quvvatlashni yoqadi
RegExp /ylastIndex xususiyatidan "yopishqoq" qidiruvni bajaradi
isFinite()Argument Infinity yoki NaN bo'lmasa true qaytaradi
isNaN()Argument NaN bo'lsa true qaytaradi
ModullarKodingizni alohida fayllarga bo'lishga imkon beradi
ReflectObyektlar ustida past darajadagi operatsiyalar uchun obyekt
ProxyBoshqaruv operatsiyalari uchun boshqa obyektlarni o'raydigan obyekt

Math xususiyatlari ​

XususiyatTavsif
Math.trunc(x)x ning butun son qismini qaytaradi
Math.sign(x)-1, 0 yoki 1 qaytaradi (x manfiy, null yoki musbat)
Math.cbrt(x)x ning kub ildizini qaytaradi
Math.log2(x)x ning 2-asosli logarifmini qaytaradi
Math.log10(x)x ning 10-asosli logarifmini qaytaradi

Number xususiyatlari ​

XususiyatTavsif
Number.EPSILON1 va 1 dan katta eng kichik son o'rtasidagi farq
Number.MIN_SAFE_INTEGERAniq ifodalanishi mumkin bo'lgan minimal qiymat
Number.MAX_SAFE_INTEGERAniq ifodalanishi mumkin bo'lgan maksimal qiymat
Number.isInteger()Argument butun son bo'lsa true qaytaradi
Number.isSafeInteger()Argument xavfsiz butun son bo'lsa true qaytaradi

JavaScript 2015 barcha zamonaviy brauzerlarda 2017-yil iyun dan beri qo'llab-quvvatlanadi.

ES6 Internet Explorer da qo'llab-quvvatlanmaydi.

JavaScript let ​

let kalit so'zi blok doirasiga ega o'zgaruvchi e'lon qilishga imkon beradi.

js
var x = 10
// Bu yerda x 10
{
  let x = 2
  // Bu yerda x 2
}
// Bu yerda x 10

JavaScript const ​

const kalit so'zi doimiy (o'zgarmas qiymatli JavaScript o'zgaruvchisi) e'lon qilishga imkon beradi. Doimiylar let o'zgaruvchilariga o'xshaydi, faqat qiymat o'zgartirib bo'lmaydi.

js
var x = 10
// Bu yerda x 10
{
  const x = 2
  // Bu yerda x 2
}
// Bu yerda x 10

Arrow funksiyalar ​

Arrow funksiyalar funksiya ifodalarini yozishning qisqa sintaksisidir. Sizga function kalit so'zi, return kalit so'zi va figurali qavslar kerak emas.

js
// Arrow dan oldin:
let myFunction = function (a, b) {
  return a * b
}

// Arrow bilan:
let myFunction = (a, b) => a * b

Eslatma

Arrow funksiyalarning o'ziga xos this si yo'q. Ular obyekt metodlarini aniqlash uchun yaxshi mos kelmaydi. Arrow funksiyalar ko'tarilmaydi. Ular ishlatilishidan oldin aniqlanishi kerak.

return va figurali qavslarni faqat funksiya bitta bayonot bo'lsa tushirib qoldirish mumkin:

js
// Bu ishlamaydi
let myFunction = (x, y) => { x * y }

// Bu ishlamaydi
let myFunction = (x, y) => return x * y

// Faqat bu ishlaydi
let myFunction = (x, y) => { return x * y }

Obyekt destruktizatsiyasi ​

Destruktizatsiya tayinlashi massiv qiymatlari va obyekt xususiyatlarini o'zgaruvchilarga tayinlashni osonlashtiradi.

js
const person = {
  firstName: 'John',
  lastName: 'Doe',
  age: 50,
  eyeColor: 'blue'
}

let { firstName, age } = person

Eslatma

Obyektni destruktizatsiya qilganda, o'zgaruvchilar uchun mos obyekt kalitlari (nomlari) bilan bir xil nomni ishlatishingiz kerak. Kalitlar (nomlar) tartibi muhim emas.

Massiv destruktizatsiyasi ​

js
const fruits = ['Banana', 'Orange', 'Apple', 'Mango']

let [fruit1, fruit2] = fruits

Spread (...) operatori ​

... operatori massiv yoki iterablni alohida elementlarga yoyadi.

js
const numbers = [23, 55, 21, 87, 56]
let minValue = Math.min(...numbers)
let maxValue = Math.max(...numbers)

... operatori massivlarni birlashtirish uchun ishlatilishi mumkin:

js
const arr1 = [1, 2, 3]
const arr2 = [4, 5, 6]
const arr3 = [...arr1, ...arr2]

For/Of sikli ​

JavaScript for/of bayonoti iterabl obyektlar qiymatlari bo'ylab aylanadi. for/of massivlar, satrlar, Map'lar, NodeList'lar va boshqa iterabl ma'lumotlar tuzilmalari bo'ylab aylanishga imkon beradi.

Massiv bo'ylab aylantirish ​

js
const cars = ['BMW', 'Volvo', 'Mini']
let text = ''

for (let x of cars) {
  text += x + ' '
}

Satr bo'ylab aylantirish ​

js
let language = 'JavaScript'
let text = ''

for (let x of language) {
  text += x + ' '
}

JavaScript Map'lar ​

Map — bu kalit-qiymat juftlarini saqlaydigan obyekt bo'lib, obyektlarga o'xshash, lekin farqlar bor:

  • Kalitlar istalgan ma'lumot turida bo'lishi mumkin (obyektlar, funksiyalar, primitiv qiymatlar)
  • Kalitlarning asl kiritilish tartibini saqlaydi
js
const fruits = new Map([
  ['apples', 500],
  ['bananas', 300],
  ['oranges', 200]
])

JavaScript Set'lar ​

Set — istalgan turdagi noyob qiymatlarni saqlaydigan obyekt. Set faqat noyob qiymatlarni o'z ichiga olishi mumkin. Dublikat qiymat qo'shishga urinish e'tiborsiz qoldiriladi.

js
const letters = new Set()

letters.add('a')
letters.add('b')
letters.add('c')

JavaScript klasslar ​

JavaScript klasslari JavaScript obyektlari uchun shablonlardir. Klass yaratish uchun class kalit so'zidan foydalaning. Har doim constructor() nomli metod qo'shing:

js
class Car {
  constructor(name, year) {
    this.name = name
    this.year = year
  }
}

Klassdan foydalanish:

js
const myCar1 = new Car('Ford', 2014)
const myCar2 = new Car('Audi', 2019)

Eslatma

JavaScript klasi obyekt emas. U JavaScript obyektlari uchun shablon.

JavaScript Promiselar ​

JavaScript Promise — bu asinxron operatsiyaning bajarilishi yoki muvaffaqiyatsizligi va uning qiymatlarini ifodalovchi obyekt.

js
const myPromise = new Promise(function (myResolve, myReject) {
  myResolve() // muvaffaqiyatli bo'lganda
  myReject() // xato bo'lganda
})

myPromise.then(
  function (value) {
    /* muvaffaqiyatli bo'lsa kod */
  },
  function (error) {
    /* xato bo'lsa kod */
  }
)

Symbol turi ​

JavaScript Symbol — Number, String yoki Boolean kabi primitiv ma'lumot turi. U hech qanday boshqa kod tasodifan kira olmaydigan noyob "yashirin" identifikatorni ifodalaydi.

js
const person = {
  firstName: 'John',
  lastName: 'Doe',
  age: 50,
  eyeColor: 'blue'
}

let id = Symbol('id')
person[id] = 140353
// Endi person[id] = 140353
// lekin person.id hali ham undefined

Eslatma

Symbollar har doim noyobdir. Bir xil tavsif bilan ikkita symbol yaratsangiz, ular turli qiymatlarga ega bo'ladi:

js
Symbol('id') == Symbol('id') // false

Standart parametr qiymatlari ​

ES6 funksiya parametrlariga standart qiymatlar berishga imkon beradi.

js
function myFunction(x, y = 10) {
  // y uzatilmasa yoki undefined bo'lsa 10 ga teng
  return x + y
}
myFunction(5) // 15 qaytaradi

Funksiya rest parametri ​

Rest parametr (...) funksiyaga noaniq sonli argumentlarni massiv sifatida qabul qilishga imkon beradi:

js
function sum(...args) {
  let sum = 0
  for (let arg of args) sum += arg
  return sum
}

let x = sum(4, 9, 16, 25, 29, 100, 66, 77)

String.includes() ​

includes() metodi satr belgilangan qiymatni o'z ichiga olsa true, aks holda false qaytaradi:

js
let text = 'Hello world, welcome to the universe.'
text.includes('world') // true qaytaradi

String.startsWith() ​

startsWith() metodi satr belgilangan qiymat bilan boshlansa true, aks holda false qaytaradi:

js
let text = 'Hello world, welcome to the universe.'
text.startsWith('Hello') // true qaytaradi

String.endsWith() ​

endsWith() metodi satr belgilangan qiymat bilan tugasa true, aks holda false qaytaradi:

js
let text = 'John Doe'
text.endsWith('Doe') // true qaytaradi

Array entries() ​

entries() metodi kalit/qiymat juftlari bilan Array Iterator obyektini qaytaradi. entries() metodi asl massivni o'zgartirmaydi.

js
const fruits = ['Banana', 'Orange', 'Apple', 'Mango']
const f = fruits.entries()

for (let x of f) {
  document.getElementById('demo').innerHTML += x
}

Array.from() ​

Array.from() metodi uzunlik xususiyatiga ega istalgan obyektdan yoki istalgan iterabl obyektdan Array obyektini qaytaradi.

js
Array.from('ABCDEFG') // [A,B,C,D,E,F,G] qaytaradi

Array keys() ​

keys() metodi massiv kalitlari bilan Array Iterator obyektini qaytaradi.

js
const fruits = ['Banana', 'Orange', 'Apple', 'Mango']
const keys = fruits.keys()

let text = ''
for (let x of keys) {
  text += x + '\n'
}

Array find() ​

find() metodi test funksiyasidan o'tgan birinchi massiv elementining qiymatini qaytaradi.

js
const numbers = [4, 9, 16, 25, 29]
let first = numbers.find(myFunction)

function myFunction(value, index, array) {
  return value > 18
}

Array findIndex() ​

findIndex() metodi test funksiyasidan o'tgan birinchi massiv elementining indeksini qaytaradi.

js
const numbers = [4, 9, 16, 25, 29]
let first = numbers.findIndex(myFunction)

function myFunction(value, index, array) {
  return value > 18
}

Modullar ​

Modullar ikki xil usulda import qilinadi:

js
// Nomlangan eksportlardan import
import { name, age } from './person.js'
js
// Standart eksportdan import
import message from './message.js'

JavaScript Reflect ​

Reflect dan oldin, obyekt operatsiyalari tarqoq edi — in, delete kalit so'zlari, Object.defineProperty kabi metodlar va [[Get]], [[Set]] kabi til mexanizmlari ishlatilardi.

Reflect bularning barchasini toza Reflect metodlariga birlashtiradi:

  • Reflect metodlari hamma narsani birlashtiradi
  • Reflect metodlari kutilgan xatti-harakatga ega
  • Reflect metodlari Proxy bilan mukammal ishlaydi
js
const person = { name: 'John', lastname: 'Doe' }

let answer = Reflect.has(person, 'name')

// in operatorini ishlatish bilan bir xil:
let answer2 = 'name' in person

JavaScript Proxy ​

js
const user = { name: 'Jan', age: 40 }

const proxy = new Proxy(user, {
  get(target, property) {
    console.log('Getting: ' + property)
    return target[property]
  },
  set(target, property, value) {
    console.log('Setting: ' + property)
    return target[property]
  }
})

proxy.name = 'John'
let text = proxy.name

Yangi Math metodlari ​

ES6 Math obyektiga quyidagi metodlarni qo'shdi:

js
Math.trunc(4.9) // 4 qaytaradi
Math.trunc(-4.2) // -4 qaytaradi
js
Math.sign(-4) // -1 qaytaradi
Math.sign(0) // 0 qaytaradi
Math.sign(4) // 1 qaytaradi
js
Math.cbrt(8) // 2 qaytaradi
Math.cbrt(64) // 4 qaytaradi
Math.cbrt(125) // 5 qaytaradi
js
Math.log2(2) // 1 qaytaradi
js
Math.log10(10) // 1 qaytaradi

Yangi Number xususiyatlari ​

js
let x = Number.EPSILON
js
let x = Number.MIN_SAFE_INTEGER
js
let x = Number.MAX_SAFE_INTEGER

Number.isInteger() metodi ​

Number.isInteger() metodi argument butun son bo'lsa true qaytaradi.

js
Number.isInteger(10) // true qaytaradi
Number.isInteger(10.5) // false qaytaradi

Number.isSafeInteger() metodi ​

Xavfsiz butun son — bu ikki aniqlikdagi son sifatida aniq ifodalanishi mumkin bo'lgan butun son. Number.isSafeInteger() metodi argument xavfsiz butun son bo'lsa true qaytaradi.

js
Number.isSafeInteger(10) // true qaytaradi
Number.isSafeInteger(12345678901234567890) // false qaytaradi

Eslatma

Xavfsiz butun sonlar -(2⁵³ - 1) dan +(2⁵³ - 1) gacha bo'lgan barcha butun sonlardir.

Yangi global metodlar ​

ES6 ikkita yangi global raqam metodini qo'shdi:

isFinite() metodi ​

Global isFinite() metodi argument Infinity yoki NaN bo'lsa false qaytaradi. Aks holda true qaytaradi:

js
isFinite(10 / 0) // false qaytaradi
isFinite(10 / 1) // true qaytaradi

isNaN() metodi ​

Global isNaN() metodi argument NaN bo'lsa true qaytaradi. Aks holda false qaytaradi:

js
isNaN('Hello') // true qaytaradi

JavaScript Object.assign() ​

Object.assign() metodi bir yoki bir nechta manba obyektdan maqsad obyektga xususiyatlarni ko'chiradi.

js
const person1 = {
  firstName: 'John',
  lastName: 'Doe',
  age: 50,
  eyeColor: 'blue'
}

const person2 = { firstName: 'Anne', lastName: 'Smith' }

Object.assign(person1, person2)

RegExp u modifikatori ​

u (unicode) flagi regulyar ifodada to'liq Unicode qo'llab-quvvatlashni yoqadi. Standart holatda, JavaScript 4-baytli Unicode belgilarni (masalan, emoji yoki kamroq uchraydigan belgilar) ikkita alohida 2-baytli surrogat kod birligi sifatida ko'radi. u flagi naqshni Unicode kod nuqtalar ketma-ketligi sifatida ko'radi.

js
let text = 'Hello 😜'

let pattern = /\p{Emoji}/u
let result = pattern.test(text)

RegExp y modifikatori ​

y (Sticky) flagi RegExp obyektining lastIndex xususiyatidan "yopishqoq" qidiruvni bajaradi. y flagi keyingi mosliklar belgilarni o'tkazib yubormasdan oldingi moslikdan darhol keyin boshlanishini ta'minlaydi.

js
let text = 'abc def ghi'
let pattern = /\w+/y

// 4-pozitsiyadan moslikni boshlash
pattern.lastIndex = 4
let result = text.match(pattern)