Ecma International утвердила ECMAScript 2022: что в ней нового?

Если вдруг кому интересно то я веду телеграм канал по фронтенду где выкладываю интересные статьи на разные темы а так же сам периодически пишу шорт-риды которые могут быть вам полезны.

22 июня 2022 123-я ассамблея Ecma General утвердила языковую спецификацию ECMAScript 2022, а значит, она стала официальным стандартом.

В посте разберемся, какие обновления добавлены в эту версию.

Содержание:

• Редакторы ECMAScript 2022  

• Что нового в ECMAScript 2022?  

  • Новые члены классов

  • Проверка приватных слотов через оператор in

  • Глобальный await в модулях 

  • Метод error.cause  

  • Метод .at() для индексируемых значений 

  • Пропозал RegExp match indices  

  • Метод Object.hasOwn(obj, propKey)  

• FAQ  

  • В чем разница между JavaScript и ECMAScript?  

  • Кто создал ECMAScript? Немного о TC39 – Комитете Ecma Technical 39  

  • Как в ECMAScript добавляются фичи? Процесс TC39 и его стадии 

  • Насколько версия ECMAScript имеет значение?  

  • Как поживает предложение [имя любимой фичи]? 

  • Где посмотреть, какие фичи добавлены в определенные версии ECMAScript?  

Бесплатные книги по JavaScript 

Редакторы ECMAScript 2022  

Редакторы этого релиза:

• Shu-yu Guo

• Michael Ficarra

• Kevin Gibbons

Что нового в ECMAScript 2022?  

Новые члены классов 

class MyClass {
instancePublicField = 1;
 static staticPublicField = 2;
 #instancePrivateField = 3;
  static #staticPrivateField = 4;
  #nonStaticPrivateMethod() {}
  get #nonStaticPrivateAccessor() {}
  set #nonStaticPrivateAccessor(value) {}
  static #staticPrivateMethod() {}
  static get #staticPrivateAccessor() {}
  static set #staticPrivateAccessor(value) {}
  static {
    // Static initialization block
  }
}

• Параметры (публичные слоты) теперь можно создать с помощью:

  • Публичных полей экземпляра (Instance public fields)

  • Публичных статических полей (Static public fields)

• В числе новинок — приватные слоты. Их можно создать через:

  • Приватные поля (приватные поля экземпляра и статические приватные поля — instance private fields и static private fields)

  • Приватные методы и асессоры (статические и не статические)

• Статические блоки инициализации (Static initialization blocks)

Проверка приватных слотов через оператор in  

Проверку приватных слотов также называют «эргономичной проверкой брендов для приватных полей». Выражение ниже — это и есть такая проверка. Она определяет, есть ли у obj приватный слот #privateSlot:

#privateSlot in obj

Вот пример:

class ClassWithPrivateSlot {
  #privateSlot = true;
  static hasPrivateSlot(obj) {
    return #privateSlot in obj;
  }
}

const obj1 = new ClassWithPrivateSlot();

assert.equal(
  ClassWithPrivateSlot.hasPrivateSlot(obj1), true
);

const obj2 = {};

assert.equal(
  ClassWithPrivateSlot.hasPrivateSlot(obj2), false
);

Уточним, что можно ссылаться на приватный слот только внутри области видимости, в которой он был объявлен.

Больше информации об этом в разделе про проверку приватных слотов.

«Глобальный» Await в модулях

Теперь мы можем использовать await на верхних уровнях модулей — больше не нужно вводить асинхронные функции или методы:

// my-module.mjs

const response = await fetch('https://example.com');
const text = await response.text();
console.log(text);

Подробнее про «Глобальный» await в модулях в соответствующем разделе.

Метод error.cause  

Теперь Error и его подклассы позволяют нам уточнять, какая предыдущая ошибка вызвала текущую:

try {
  // Do something
} catch (otherError) {
  throw new Error('Something went wrong', {cause: otherError});
}

Причина ошибки err отображается в трассировке стека и доступна через err.cause.

Больше информации о error.cause здесь.

Метод .at() для индексируемых значений

Метод .at() для индексируемых значений позволяет читать элемент по заданному индексу, как с операторными скобками []. Но, в отличие от операторных скобок, .at() поддерживает отрицательные индексы.

> ['a', 'b', 'c'].at(0)
'a'
> ['a', 'b', 'c'].at(-1)
'c'

Ниже приведены индексируемые типы, в которых применяется метод .at():

• string

• Array

• Все классы типизированных массивов: Uint8Array и т.д.

О методе .at() для индексируемых значений.

Пропозал RegExp match indices  

Если мы добавим флаг /d к регулярному выражению, при его использовании создаются объекты соответствия. Они записывают начальный и конечный индекс каждого группового захвата (строки A и B):

const matchObj = /(a+)(b+)/d.exec('aaaabb');assert.equal(
  matchObj[1], 'aaaa'
);

assert.deepEqual(
  matchObj.indices[1], [0, 4] // (A)
);

assert.equal(
  matchObj[2], 'bb'
);

assert.deepEqual(
  matchObj.indices[2], [4, 6] // (B)
);

По ссылке подробное объяснение и примеры использования RegExp match indices.

Метод Object.hasOwn(obj, propKey)

Параметр Object.hasOwn(obj, propKey) — это безопасный способ проверить, есть ли у объекта obj свое собственное (не наследуемое) свойство с ключом propKey:

const proto = {
  protoProp: 'protoProp',
};

const obj = {
  proto: proto,
  objProp: 'objProp',
}

assert.equal('protoProp' in obj, true); //(A)
assert.equal(Object.hasOwn(obj, 'protoProp'), false); // (B)
assert.equal(Object.hasOwn(proto, 'protoProp'), true); // (C)

Обратите внимание, что in определяет наследуемые свойства (строка A), в то время как Object.hasOwn() определяет только собственные свойства (строки B и C).

Больше информации об Object.hasOwn()в этом разделе.

FAQ  

В чем разница между JavaScript и ECMAScript?  

• Если кратко и простым языком:

  • JavaScript — это язык программирования, который используется для различных платформ (браузеров, Node.js, Deno, и т.д.).

  • ECMAScript — это языковой стандарт, которому соответствует JavaScript. Подробнее про спецификацию ECMAScript на этом сайте.

• Более развернутый ответ расписан в главе «3.2 Стандартизация JavaScript» в книге «Современный JavaScript для нетерпеливых».

Кто создал ECMAScript? TC39 – Ecma Technical Committee 39  

В организации по языковым стандартам Ecma International есть Технический Комитет 39 (Technical Committee 39 или TC39). Именно этот комитет и разработал ECMAScript.

Грубо говоря, члены комитета — крупные компании: Adobe, Apple, Facebook, Google, Microsoft, Mozilla, Opera, Twitter и другие. То есть, компании, которые конкурируют в своих сегментах рынка, вместе работают над JavaScript.

Каждые два месяца TC39 проводит заседания — члены комитета назначают туда делегатов и приглашают экспертов. Протоколы заседаний есть в открытом доступе в отдельном репозитории GitHub.

Кроме проведения заседаний, ТС39 сотрудничает с различными участниками и группами JavaScript-сообщества.

Как в ECMAScript добавляют фичи? О стадиях процесса ТС39

Сначала ТС39 рассматривает новые функции ECMAScript. Заявки проходят через несколько этапов, где:

• Нулевой этап — участники предлагают идеи, TC39 вносит свои комментарии к предложению;

• Четвертый, завершающий, — предложенная функция готова к добавлению в ECMAScript.

Если фича доходит до 4-го этапа, ее точно планируют внедрить в ECMAScript. Набор функций версии ECMAScript обычно замораживают (то есть окончательно формируют) в марте каждого года. Фичи, которые добрались до 4-го этапа после этого дедлайна, переносятся в версию ECMAScript следующего года.

Больше нюансов вы найдете в книге «Современный JavaScript для нетерпеливых» глава «3.5 The TC39 process»

Насколько версии ECMAScript имеют значение?  

С тех пор как процесс TC39 был учреждён, важность версий ECMAScript значительно упала. Большее значение сейчас имеет то, до какой стадии дошла предложенная фича. Если она дошла до четвертой, ее можно безопасно использовать. Но даже в этом случае необходимо проверять, поддерживают ли функцию движки, на которые вы ориентируетесь.

Как поживает предложение [имя  любимой фичи]?  

Если вам интересно, на какой ступени находятся определенные фичи, посмотрите репозиторий TC39 с предложениями.

Где я могу посмотреть, какие фичи появились в определенной версии ECMAScript?

Есть несколько мест, где можно проверить обновления ECMAScript:

• В «Современном JavaScript для нетерпеливых» есть раздел с обновлениями каждой версии ECMAScript. Здесь же вы найдете ссылки на пояснения.

• В репозитории TC39, где выложена таблица с одобренными улучшениями. В ней отражено, в каких версиях ECMAScript представлены (или будет представлены) фичи.

• В разделе «Introduction» языковой спецификации ECMAScript  — в нем указан список обновлений каждой версии.

• В репозитории ECMA-262 на странице с релизами.

Бесплатные книги про JavaScript  

Мои книги про JavaScript можно бесплатно прочитать онлайн:

• «Современный JavaScript для нетерпеливых (издание ES2022)» охватывает JavaScript до ECMAScript 2022 включительно.

• «Глубокий JavaScript: теории и техники»более подробно объясняет основы языка.