17 июня 2015 г. ECMA International опубликовала шестую основную версию ECMAScript, которая официально называется ECMAScript 2015 и первоначально называлась ECMAScript 6 или ES6.

После выпуска ES6Технический комитет 39 ECMA (TC39) управляет спецификацией ECMA. Они решили выпускать новую версию ECMAScript каждый год, начиная с 2015 года. Ежегодное обновление означает, что больше не будет больших выпусков, таких как ES6.

TC39 использует следующие четыре этапа для преобразования идеи в новую функцию ECMA Script.

Подробнее о процессе TC39 читайте здесь: https://tc39.es/process-document/

С 2015 по 2020 год TC39 выпустил много новых функций ECMAScript, чтобы сделать язык JavaScript более сильным, как

Давайте подробно прочитаем эти функции и узнаем, как использовать эти функции в повседневной жизни кодирования.

Что нового в ES7

Array.prototype.includes()
Exponentiation operator (**)

Array.prototype.includes()

Возвращает true, если массив содержит значение, иначе возвращает false.

Почему включает?

Array.prototype.includes() справляется с NaN лучше, чем Array.prototype.indexOf(). Если массив содержит NaN, то indexOf() не возвращает правильный индекс при поиске NaN.

Примечание: NaNпредставляет собой «Not a Number».

Оператор возведения в степень

JavaScript уже поддерживает многие арифметические операторы, такие как +, -, * и другие. ECMAScript 2016 представил оператор возведения в степень ** . Он имеет ту же цель, что и Math.pow(). Он возвращает первый аргумент, возведенный в степень второго аргумента.

Ссылка: здесь

Что нового в ES8

ES8 (также называемый ES2017) предлагает несколько новых функций, перечисленных ниже.

1. Object.values()
2. Object.entries()
3. String padding (padStart() and padEnd())
4. Object.getOwnPropertyDescriptors()
5. Trailing commas in function parameter lists and calls
6. Async functions (async and await)
7. Shared memory and atomics

Объект.значения():

Он возвращает массив со значениями объекта.

Объект.записи():

Он превращает атрибуты объекта (ключ, значение) в массив атрибутов.

Заполнение строки (padStart и padEnd)

Методы padStart() и padEnd() дополняют строку другой строкой (или пустой строкой) до тех пор, пока результирующая строка не достигнет заданной длины. Строка будет повторяться по мере необходимости.

padStart() заполнение применяется к левой (началу) части строки.
padEnd() заполнение применяется к правой (конечной) стороне строки.

Синтаксис:

'string'.padStart(targetLength, padString);
'string'.padEnd(targetLength, padString);

Как использовать функцию padStart

'cat'.padStart(5); // ' cat' [Empty space added in the beginning]
'cat'.padStart(5, 'a'); // 'aacat'
'cat'.padStart(1, 'a'); // 'cat' [Nothing happen]
'cat'.padStart(5, 'abc'); // 'abcat'
'cat'.padStart(8, 'abc'); // 'abcabcat' [padString start repeating]

Как использовать функцию padEnd

'cat'.padEnd(5); // 'cat ' [Empty space added in the end]
'cat'.padEnd(5, 'a'); // 'cataa'
'cat'.padEnd(1, 'a'); // 'cat'
'cat'.padEnd(5, 'abc'); // 'catab'
'cat'.padEnd(8, 'abc'); // 'catabcab'

Лучший пример:

Example 1: Выравнивание вывода консоли

const data = {
    Portland: '78/50',
    Dublin: '88/52',
    Lima: '58/40'
};
Object.entries(data).map(([city, temp]) => {
    console.log(`City: ${city.padEnd(16)} Weather: ${temp}`)
});

Example 2: Получить текущую дату в Javascript

var today = new Date();
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0');
var yyyy = today.getFullYear();
today = mm + '/' + dd + '/' + yyyy;
console.log(today);

Вывод: 02/17/2020 (сегодняшняя дата в формате мм/дд/гггг)

Object.getOwnPropertyDescriptors()

Важно. В настоящее время Internet Explorer не поддерживает этот метод.

Этот метод возвращает все собственные дескрипторы свойств данного объекта.

property descriptor — это запись с некоторыми из следующих атрибутов:

значение: значение, связанное со свойством (только дескрипторы данных).
доступно для записи: истинно тогда и только тогда, когда значение, связанное со свойством, может быть изменено (данные только дескрипторы).
get: функция, которая служит получателем свойства или undefined, если получателя нет (только дескрипторы доступа).
set: функция, которая служит установщиком для свойства, или undefined, если установщика нет (только дескрипторы доступа).
настраиваемый: true, если и только если тип этого дескриптор свойства может быть изменен, и если свойство может быть удалено из соответствующего объекта.
перечисляемый: true, если и только если это свойство отображается во время перечисления свойств соответствующего объекта.

Пример:

Больше примеров смотрите здесь.

Конечные запятые в списках параметров функций и вызовах:

Завершающая запятая — это чисто синтаксическое изменение. В ES5, чтобы сделать его корректным JavaScript, после последнего аргумента функции не должно быть запятой.

Пример:

Подробнее о завершающих запятых читайте здесь.

Асинхронные функции (async и await):

ECMAScript 2017 представляет новый способ написания асинхронного кода. Предыдущие альтернативы асинхронному коду — это обратные вызовы и промисы. Асинхронную функцию можно определить как

Идея, стоящая за асинхронной функцией

We know JavaScript is a synchronous, blocking, single-threaded language but synchronous world is using asynchronous callbacks which leads a major problem known as Pyramid of doom (or Callback hell) to make callback behavior synchronous.
In ES2015(ES6): Promises has addressed this problem and provided a better solution. Promises allow us to write sequential asynchronous JavaScript code that doesn’t block threads while waiting for a response, but it has come with a price. Promise also has some pitfalls like
It’s easy to end up in a situation where errors aren’t handled. This can often lead to those errors being “swallowed” — not reported.
Calling a function that returns a promise but failing to have a then or catch to respond to the result (or rejection) is not something that will be caught by the JavaScript engine.
It’s important also to understand that promises begin executing immediately upon creation. They don’t wait for you to do something with them. If you need a promise to wait, you need to use something called a promise factory (a fancy term for a function that returns a promise).
To fulfil Promise gap ES2017 released Async/await which is an improvement over promise and no more than a syntactic sugar.

"Асинхронные функции – это асинхронные функции, которые возвращают "обещания"".

Синтаксис

Async функция() {
Await…
}

Как это работает

  • Асинхронные функции объявляются путем добавления слова async в их объявление.
  • Ключевое слово await можно поместить перед любой асинхронной функцией на основе обещаний, чтобы приостановить код в этой строке до тех пор, пока обещание не будет выполнено, а затем вернуть результирующее значение. В то же время другой код, который может ожидать шанса на выполнение, может это сделать.

Чтобы узнать, какая проблема была решена асинхронной функцией, посетите эту статью.

Правила для асинхронного ожидания

  • async функции возвращают обещание.
  • async функции используют неявное промис для возврата результата. Даже если вы не возвращаете промис явно, функция async гарантирует, что ваш код будет передан через промис.
  • await блокирует выполнение кода внутри функции async, частью которой является он (оператор await).
  • Внутри одной async функции может быть несколько операторов await.
  • При использовании async await обязательно используйте try catch для обработки ошибок.
  • Будьте особенно осторожны при использовании await в циклах и итераторах. Вы можете попасть в ловушку написания последовательно исполняемого кода, когда это можно было бы легко сделать параллельно.
  • await всегда соответствует одному обещанию.
  • Создание промиса запускает выполнение асинхронной функциональности.
  • await только блокирует выполнение кода внутри асинхронной функции. Это только гарантирует, что следующая строка будет выполнена, когда обещание будет разрешено. Таким образом, если асинхронная активность уже запущена, await не повлияет на нее.

Чтобы узнать больше о том, должен ли я использовать обещание или асинхронное ожидание, пожалуйста, прочитайте эту статью 1, статью 2.

Пример:

Общая память и атомарность

Общая память и атомарность или SharedArrayBuffer служат низкоуровневым строительным блоком для высокоуровневых абстракций параллелизма. Они позволяют разработчикам совместно использовать байты объекта SharedArrayBuffer между несколькими рабочими процессами и основным потоком. Такой подход позволяет быстрее обмениваться данными, а также улучшать и оптимизировать координацию между работниками.

Подробнее по теме: здесь

Ссылка:

Прежде чем попрощаться…

Большое спасибо за то, что нашли свое драгоценное время, чтобы прочитать этот пост.

Ознакомьтесь с другими моими популярными статьями ниже! Пожалуйста, 👏 поделитесь этой статьей!
Новые функции ECMAScript 2018 (ES2018 или ES9) — JavaScript
Новые функции ECMAScript 2019 (ES2019 или ES10) — JavaScript

Вы можете связаться со мной @LinkedIn