Абнаўленні JavaScript пачынаючы з ES6. Спіс
Прывітанне сябры.
Сення для вас пакрокавы агляд зменаў у JS згодна са стандартамі ECMAScript (ES), пачынаючы з ES6 (2015) і далей, з кароткім апісаннем і прыкладамі кода для кожнай функцыі:
2015 (ES6 / ECMAScript 2015)
Let і Const
Апісанне: Пераменныя з блочным узроўнем бачнасці. let дазваляе перапрызначэнне пераменнай, у той час як const робіць пераменныю нязменнай.
Прыклад:
text1let count = 10; 2const name = "Alice";
Стрэлачныя функцыі (Arrow Functions)
Апісанне: Карацейшы сінтаксіс і няма oласных this, constructor, args.
Прыклад:
text1const add = (a, b) => a + b;
Шаблонныя літэралы (Template Literals)
Апісанне: Пашыраныя літэралы для ўстаўкі значэнняў у радкі і шматрадковыя радкі з выкарыстаннем зваротных апострафаў.
Прыклад:
text1const greeting = `Hello, ${name}!`;
Класы (Classes)
Апісанне: Сінтаксіс class для стварэння канструктарных функцый і наследавання.
Прыклад:
text1class Person { 2 constructor(name) { 3 this.name = name; 4 } 5 greet() { 6 return `Hello, ${this.name}`; 7 } 8}
Модулі (Modules)
Апісанне: Падтрымка модуляў з выкарыстаннем ключавых слоў import і export.
Прыклад:
text1// module.js 2export const name = "Alice"; 3 4// main.js 5import { name } from './module.js';
Дэструктурызацыя (Destructuring Assignment)
Апісанне: Выняцце значэнняў з масіваў або ўласцівасцяў аб'ектаў у пераменныя.
Прыклад
text1:const [x, y] = [1, 2]; 2const { name, age } = { name: "Alice", age: 25 };
Параметры па змаўчанні (Default Parameters)
Апісанне: Параметры функцый могуць мець значэнні па змаўчанні.
Прыклад:
text1function greet(name = "Guest") { 2 return `Hello, ${name}`; 3}
Аператары Spread і Rest
Апісанне: Spread (...) раздзяляе масівы/аб'екты; Rest (...) збірае астатнія элементы.
Прыклад:
text1const numbers = [1, 2, 3]; 2const moreNumbers = [...numbers, 4, 5]; 3 4function sum(...args) { 5 return args.reduce((a, b) => a + b, 0); 6}
Промісы (Promises)
Апісанне: Убудаваныя промісы для працы з асінхроннымі аперацыямі.
Прыклад:
text1const promise = new Promise((resolve, reject) => { 2 setTimeout(() => resolve("Success!"), 1000); 3});
Генератары (Generators)
Апісанне: Функцыі, якія можна прыпыняць і аднаўляць (function* і yield).
Прыклад:
text1function* idGenerator() { 2 let id = 1; 3 while (true) { 4 yield id++; 5 } 6}
Map і Set
Апісанне: Новыя структуры дадзеных для захавання ключ-значэння (Map) і ўнікальных значэнняў (Set).
Прыклад:
text1const map = new Map(); 2map.set('key', 'value'); 3 4const set = new Set([1, 2, 3, 3]);
Сімвалы (Symbols)
Апісанне: Новы прымітыўны тып дадзеных для стварэння унікальных ідэнтыфікатараў.
Прыклад:
text1const sym = Symbol('description');
Ітэратары і цыкл For-Of
Апісанне: Ітэратары – аб'екты, якія вызначаюць паслядоўнасць і могуць вяртаць значэнне пры заканчэнні паслядоўнасці. Цыкл for-of для ітэрацыі па ітэруемых аб'ектах.
Прыклад:
text1const array = [1, 2, 3]; 2for (const value of array) { 3 console.log(value); 4}
WeakMap і WeakSet
Апісанне: Падобныя на Map і Set, але са слабымі спасылкамі на ключы/значэнні (дакументацыя).
Прыклад:
text1const weakMap = new WeakMap(); 2const obj = {}; 3weakMap.set(obj, 'value');
Удасканаленні Math, Number, String і Object
Апісанне: Новыя метады, дададзеныя ў Math, Number, String і Object.
Прыклад:
text1Math.trunc(4.9); // 4 2Number.isNaN(NaN); // true 3 4Object.assign({}, {a: 1}, {b: 2}); // {a: 1, b: 2}
2016 (ES7 / ECMAScript 2016)
Аператар узвядзення ў ступень (Exponentiation Operator)
Апісанне: Спрошчаны разлік ступені з **.
Прыклад:
text1const square = 2 ** 2; // 4
Array.prototype.includes
Апісанне: Правярае, ці ёсць у масіве пэўнае значэнне.
Прыклад:
text1const array = [1, 2, 3]; 2array.includes(2); // true
2017 (ES8 / ECMAScript 2017)
Async/Await
Апісанне: Сінтаксічны цукар для працы з промісамі, што робіць асінхронны код прасцейшым для чытання і напісання.
Прыклад:
text1async function fetchData() { 2 const response = await fetch('https://api.example.com/data'); 3 const data = await response.json(); 4 return data; 5}
Object.entries і Object.values
Апісанне: Метад атрымлівае масіў уласных пералічаных уласцівасцяў аб'екта ў выглядзе пар [ключ, значэнне] і значэнняў.
Прыклад:
text1const obj = { a: 1, b: 2 }; 2Object.entries(obj); // [['a', 1], ['b', 2]] 3Object.values(obj); // [1, 2]
Дабаўленне радкоў (String Padding)
Апісанне: Метад padStart і padEnd дадае сімвалы да радка да дасягнення пэўнай даўжыні.
Прыклад:
text1'5'.padStart(2, '0'); // '05' 2'5'.padEnd(2, '0'); // '50'
Object.getOwnPropertyDescriptors
Апісанне: Вяртае ўсе ўласныя апісальнікі ўласцівасцяў аб'екта.
Прыклад:
text1const obj = { prop: 1 }; 2const descriptors = Object.getOwnPropertyDescriptors(obj); 3/*{ 4 "prop": { 5 "value": 1, 6 "writable": true, 7 "enumerable": true, 8 "configurable": true 9 } 10} */
Завяршаючыя коскі ў спісах параметраў і выкліках функцый (Trailing Commas in Function Parameter Lists and Calls)
Апісанне: Дазваляе выкарыстоўваць завяршаючыя коскі ў параметрах функцый і аргументах.
Прыклад:
text1function foo( 2 param1, 3 param2, 4) { /*...*/ } 5 6foo( 7 'a', 8 'b', 9);
2018 (ES9 / ECMAScript 2018)
Асінхронныя ітэратары (Async Iteration)
Апісанне: Цыкл for-await-of для ітэрацыі па асінхронных ітэруемых аб'ектах.
Прыклад:
text1async function process(array) { 2 for await (let value of array) { 3 console.log(value); 4 } 5}
Rest/Spread уласцівасцяў (Rest/Spread Properties)
Апісанне: Spread і rest уласцівасцяў для аб'ектаў.
Прыклад:
text1const obj = { a: 1, b: 2, c: 3 }; 2const { a, ...rest } = obj; // rest = { b: 2, c: 3 } 3const newObj = { ...rest }; // { b: 2, c: 3 }
Promise.finally
Апісанне: Дадае метад .finally() у промісы, які выконвае зваротны выклік пры завяршэнні промісу незалежна ад выніку.
Прыклад:
text1fetch('/api') 2 .then(response => response.json()) 3 .catch(error => console.error(error)) 4 .finally(() => console.log('Fetch attempt finished.'));
Паляпшэнні RegExp
Апісанне: Новыя функцыі у рэгулярных выразах.
Прыклад:
text1const regExp = /(?<=\$)\d+/; // lookbehind assertion 2const match = 'Price: $10'.match(regExp); // ['10'] 3 4const regExpNamed = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/; 5const result = regExpNamed.exec('2020-12-01'); 6console.log(result.groups.year); // '2020'
2019 (ES10 / ECMAScript 2019)
Array.prototype.flat і Array.prototype.flatMap
Апісанне: flat сплюшчвае ўкладзеныя масівы, flatMap - адлюстроўвае і сплюшчвае вынік.
Прыклад:
text1const arr = [1, [2, [3]]]; 2arr.flat(2); // [1, 2, 3] 3 4const arr1 = [1, 2, 1]; 5 6const result = arr1.flatMap((num) => (num === 2 ? [2, 2] : 1)); 7 8console.log(result); 9// Expected output: Array [1, 2, 2, 1] 10
Object.fromEntries
Апісанне: Канвертуе спіс пар ключ-значэнне ў аб'ект.
Прыклад:
text1const entries = [['a', 1], ['b', 2]]; 2const obj = Object.fromEntries(entries); // { a: 1, b: 2 }
String.prototype.trimStart і String.prototype.trimEnd
Апісанне: Прыбірае прабелы з пачатку і канца радка.
Прыклад:
text1const str = ' hello '; 2str.trimStart(); // 'hello ' 3str.trimEnd(); // ' hello'
Неабавязковая пераменная ў блоку catch (Optional Catch Binding)
Апісанне: Дазваляе апусціць пераменную памылкі ў блоку catch.
Прыклад:
text1try { 2 // code 3} catch { 4 console.error('An error occurred'); 5}
Symbol.prototype.description
Апісанне: Дазваляе атрымаць апісанне сімвала непасрэдна.
Прыклад:
text1const sym = Symbol('desc'); 2console.log(sym.description); // 'desc'
Рэвізія Function.prototype.toString
Апісанне: Метад toString() вяртае дакладныя сімвалы, уключаючы прабелы і каментарыі.
Прыклад:
text1function /* comment */ foo() {} 2console.log(foo.toString()); // 'function /* comment */ foo() {}'
2020 (ES11 / ECMAScript 2020)
Аператар выбару (Optional Chaining (?.))
Апісанне: Бяспечны доступ да глыбока ўкладзеных уласцівасцяў.
Прыклад:
text1const user = {}; 2const street = user.address?.street; // undefined
Аператар Nullish Coalescing (??)
Апісанне: Вяртае правы аперанд, калі левы аперанд null або undefined.
Прыклад:
text1const name = null ?? 'Guest'; // 'Guest'
Дынамічны імпарт (Dynamic import())
Апісанне: Дынамічны імпарт модуляў.
Прыклад:
text1import('/modules/my-module.js') 2 .then(module => { 3 // use module 4 });
BigInt
Апісанне: Дазваляе прадстаўленне і апрацоўку цэлых лікаў, большых за Number.MAX_SAFE_INTEGER.
Прыклад:
text1const bigNumber = 123456789012345678901234567890n;
Promise.allSettled
Апісанне: Вяртае проміс, які вырашаецца, калі ўсе перададзеныя промісы альбо вырашаны, альбо адхілены.
Прыклад:
text1const promises = [Promise.resolve(1), Promise.reject('error')]; 2Promise.allSettled(promises) 3 .then(results => console.log(results));
GlobalThis
Апісанне: Стандартны спосаб доступу да глабальнага this значэння ў розных асяроддзях.
Прыклад:
text1globalThis.setTimeout(() =>console.log('Hello'), 1000);
String.prototype.matchAll
Апісанне: Вяртае ітэратар усіх супадзенняў у радку з рэгулярным выразам.
Прыклад:
text1const regex = /t(e)(st(\d?))/g; 2const str = 'test1test2'; 3const matches = [...str.matchAll(regex)];
Экспарт прастораў імёнаў модуля (Module Namespace Exports)
Апісанне: Паляпшэнне падтрымкі апрацоўкі прастораў імёнаў у ES модулях.
Прыклад:
text1export * as ns from 'module';
2021 (ES12 / ECMAScript 2021)
Аператары лагічнага прызначэння (&&=, ||=, ??=)
Апісанне: Аб'ядноўваюць лагічныя аперацыі з выказваннямі прызначэння.
Прыклад:
text1let a = 1; 2a ||= 2; // a = 1 3 4let b = null; 5b ??= 2; // b = 2
Лічбавыя раздзяляльнікі (Numeric Separators)
Апісанне: Падкрэсленні выкарыстоўваюцца як раздзяляльнікі для паляпшэння чытальнасці лікавых літаралаў.
Прыклад:
text1const largeNumber = 1_000_000; // 1000000
String.prototype.replaceAll
Апісанне: Замяняе ўсе ўхапленні падрадка.
Прыклад:
text1const str = 'foo foo'; 2const newStr = str.replaceAll('foo', 'bar'); // 'bar bar'
Promise.any
Апісанне: Вяртае першы вырашаны проміс або масіў з памылкамі, калі ўсе промісы былі адхілены.
Прыклад:
text1const promises = [Promise.reject(1), Promise.resolve(2)]; 2Promise.any(promises) 3 .then(result => console.log(result)); // 2
WeakRefs
Апісанне: Стварае слабыя спасылкі на аб'екты, каб пазбегнуць прадухілення збору смецця.
Прыклад:
text1const obj = {}; 2const weakRef = new WeakRef(obj);
FinalizationRegistry
Апісанне: Рэгіструе зваротны выклік для ачысткі аб'ектаў, якія былі сабраны зборшчыкам смецця.
Прыклад:
text1const registry = new FinalizationRegistry(heldValue => { 2 console.log('Object was garbage collected', heldValue); 3}); 4 5let obj = {}; 6registry.register(obj, 'myValue'); 7obj = null; // obj is now eligible for garbage collection
2022 (ES13 / ECMAScript 2022)
Класыз прыватнымі палямі (Class Fields)
Апісанне: Публічныя і прыватныя метады і метады экземпляра ў класах.
Прыклад:
text1class MyClass { 2 myField = 10; // public field 3 #privateField = 20; // private field 4 5 getPrivateField() { 6 return this.#privateField; 7 } 8}
Верхняўзроўневае await (Top-Level Await)
Апісанне: Дазваляе выкарыстанне await на верхнім узроўні модуляў.
Прыклад:
text1const data = await fetch('/api/data').then(res => res.json()); 2console.log(data);
Індэксы супадзенняў RegExp (RegExp Match Indices)
Апісанне: matchAll вяртае пазіцыі пачатку і канца супадзенняў.
Прыклад:
text1const regex = /(foo)/g; 2const str = 'foo foo'; 3const matches = [...str.matchAll(regex)]; 4console.log(matches[0].indices); // [[0, 3], [0, 3]]
2023 (ES14 / ECMAScript 2023)
Метады findLast і findLastIndex для масіваў і TypedArray
Апісанне: Метад для пошуку апошняга элемента і яго індэкса ў масіве або TypedArray.
Прыклад:
text1const arr = [1, 2, 3, 4]; 2const lastEven = arr.findLast(n => n % 2 === 0); // 4 3const lastEvenIndex = arr.findLastIndex(n => н % 2 === 0); // 3
Сімвалы як ключы для WeakMap
Апісанне: Сімвалы можна выкарыстоўваць у якасці ключоў у WeakMap.
Прыклад:
text1const sym = Symbol('key'); 2const wm = new WeakMap(); 3wm.set(sym, 'value');
Групоўка масіваў (Array Grouping)
Апісанне: Метад groupBy і groupByToMap для групавання элементаў у масівах.
Прыклад:
text1const array = ['one', 'two', 'three']; 2const grouped = array.groupBy(word => word.length); 3// { 3: ['one', 'two'], 5: ['three'] }
Граматыка Hashbang
Апісанне: Дазваляе выкарыстанне #! у пачатку скрыптаў для Unix-падобных асяроддзяў.
Прыклад:
text1#!/usr/bin/env node 2console.log('Hello, world!');
Заключэнне
Такім чынам мы разгледзеді важныя абнаўленні ў JS за апошнія некалькі гадоў, і спадзяюся што наша праца будзе для вас карыснай. Хацелася б адзначыць што былі і іншыя змены, але яны не былі настолькі важнымі, таму у гэты спіс не папалі.
ЗЫ : Калі ласка далучайцеся да нашых аўтараў. Давайце пашыраць нашу беларускамоўную прастору разам.
Каментары
(Каб даслаць каментар залагуйцеся ў свой уліковы запіс)