Перед вами перевод статьи из блога Carlos Caballero на сайте Medium.com. Автор расскажет нам о функциях, которые появились в версии ES10 2019 года.



ES10 — это версия ECMAScript, актуальная для 2019 года. Она содержит не так много нововведений, как версия ES6, выпущенная в 2015 году, однако в нее включили несколько полезных функций.

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

Новыми функциями JavaScript в ES2019 являются:

  • Array#{flat,flatMap}
  • Object.fromEntries
  • String#{trimStart,trimEnd}
  • Symbol#description
  • необязательная привязка try { } catch {} //
  • JSON ? ECMAScript
  • хорошо сформированный JSON.stringify
  • устойчивый Array#sort
  • обновленная Function#toString
  • BigInt — простой тип (3 стадия)
  • динамический импорт (3 стадия)
  • стандартизированный объект global This (3 стадия).

Array.flat() и Array.flatMap()


Существует два новых метода Array:

  • Метод Array.flat() возвращает новый массив, в котором все элементы вложенных подмассивов были рекурсивно подняты на указанный уровень depth.
  • Метод Array.flatMap() сначала применяет функцию к каждому элементу, а затем преобразует полученный результат в плоскую структуру и помещает в новый массив. Это идентично функции map() с последующим применением функции flat() с параметром depth, равным 1, но flatMap() чаще более эффективен, поскольку совмещает в себе оба подхода в одном методе.



Object.fromEntries()


Преобразует список кода и пары значений в объект.



String.prototype.matchAll


При сопоставлении строки с регулярным выражением метод matchAll() возвращает итератор по всем результатам, включая группы захвата.



String.trimStart() and String.trimEnd()


Появилось два новых метода String для удаления пробелов из строки:

  • Метод trimStart() удаляет пробел в начале строки.
  • Метод trimEnd() удаляет пробел в конце строки.



Symbol.Description


Добавлен новый вариант получения описания Symbol. Теперь, создавая Symbol, вы можете добавить строку в качестве описания — в ES10 есть доступ к этому показателю.



Необязательная привязка try/catch


Раньше выражение catch из конструкции try/catch нуждалось в переменной. Сегодня разработчики могут использовать try/catch без создания ненужной привязки.



JSON ? ECMAScript


Символы неэкранированного разделителя строк U+2028 и разделителя абзацев U+2029 не были представлены в предыдущих версиях ECMAScript.

  • U+2028 — разделитель абзацев.
  • U+2029 — разделитель строк.



Хорошо сформированный JSON.stringify()


JSON.stringify() может возвращать символы между U+D800 и U+DFFF в качестве значений, для которых не существует эквивалента символов UTF-8. Однако формату JSON необходимо кодирование UTF-8. Было предложено решение представить непарные суррогатные кодовые точки в качестве экранированных последовательностей JSON вместо того, чтобы оставить их одиночными кодовыми единицами UTF-16.



Устойчивый Array.prototype.sort()


В предыдущей реализации движка V8 использовался нестабильный алгоритм быстрой сортировки для массивов, содержащих более 10 элементов.

Алгоритм стабильной сортировки — это алгоритм сортировки, при котором два объекта с одинаковыми ключами остаются в том же порядке, в котором они были до сортировки.



Обновленная Function.toString()


Метод toString() возвращает строковое представление исходного кода функции. В ES6 при вызове toString() для функции он мог возвращать разный результат в зависимости от конкретной реализации движка ECMAScript. По возможности возвращался исходный код, в противном случае — стандартизированная заглушка.



BigInt — целые числа произвольной длины


BigInt — это 7-й примитивный тип, целое число произвольной длины. Переменные данного типа могут состоять из 253 числовых знаков, они не ограничены числовым значением 9007199254740992.



Динамический импорт


Динамический import() возвращает промис для объекта пространства имен запрашиваемого модуля. Следовательно, теперь импорт можно назначить переменной, используя async/await.



Стандартизированный объект globalThis


Объект globalThis не был стандартизирован до появления ES10. В коде готового приложения его приходилось приводить к стандарту для различных платформ самостоятельно, прописывая нечто громоздкое, например:



Заключение


JavaScript является живым языком, что очень благоприятно для веб-программирования. Мы наблюдаем его динамичное развитие с момента появления ES6 в 2015 году. В этой статье мы осветили функции, которые появились в версии ES10 2019 года. Также были представлены некоторые функции, которые обретут стабильность в ES11 (2020), поскольку они находятся в 3 стадии внедрения и, вероятно, в итоге будут стандартизированы для следующего выпуска.
Многие из этих функций могут оказаться ненужными для создания вашего веб-приложения. Однако все они дают возможность обойтись без хитроумных приемов или написания большого количества кода там, где это требовалось раньше.

Комментарии (17)


  1. Koneru
    11.10.2019 15:51

    Del


  1. Psychosynthesis
    12.10.2019 04:00

    Del. Туплю, извините.


    1. Koneru
      12.10.2019 14:07

      Тоже написал что это ES9, а не ES10?)))


      1. Psychosynthesis
        13.10.2019 02:53

        Лол. Не, я просто достаточно бегло посмотрел на пример и не сразу понял зачем же нужен Object.fromEntries(). Там вначале объект объявлен как листинг и я чёт затупил, не обратил внимание, что там потом ещё значения получаются через Object.entries. Хотел спросить нафига — типа если объект листингом объявить, он и так объект… Потом посмотрел внимательней пример и понял где тормознул.


  1. VolCh
    12.10.2019 09:23
    +1

    Мне одному режет глаз именование ESN, где N > 6 и N < 2015?


    1. NerVik
      12.10.2019 12:32

      нет, не одному. очень неудобно и даже неправильно, насколько я помню даже TC39 отказались от наименований ES6-7-8-9 и т.д. в пользу ES(Year). а ES6 сейчас больше принято использовать как обобщение для всех ES2015+


  1. Daddy_Cool
    12.10.2019 13:45
    +1

    Интеллектуально-кликбейтный заголовок статьи. Читатель Хабра обязательно захочет узнать, что же это за зверь такой — ES10. А там…


    1. mclander
      12.10.2019 15:35

      Мне не повезло. Я и так знал, поэтому я здесь)


  1. mclander
    12.10.2019 15:34

    За использование Infinity в качестве параметра хочется взять и у… Ох уж эти любители "красивых решений", логичнее, чтобы вместо Infinity был использован пустой параметр или хотя бы -1.


    Хотя больше хочется, чтобы в flat параметром был не уровень повышения, а уровень приведения.


    1. Metotron0
      12.10.2019 20:52

      Что плохого в Infinity? Обычное число, интуитивное, если знаешь, что за параметр у функции.


      1. mclander
        13.10.2019 01:02

        Тем что это первое использование в встроенных функциях таким образом


        1. Metotron0
          13.10.2019 21:28

          Первое использование не значит плохое


  1. shaukote
    13.10.2019 17:31

    Не очень понятно, откуда взялось ограничение в 253 числовых знака для BigInt. Спецификация говорит про значения BigInt, что "The value may be any size and is not limited to a particular bit-width".


  1. LokiMan
    14.10.2019 08:07

    А подскажите, кто знает, что за шрифт используется на скриншотах?


    1. Next
      14.10.2019 11:33

      1. LokiMan
        14.10.2019 12:08

        Спасибо!


  1. defaultvoice
    14.10.2019 10:35

    А с чего это вдруг Stage 3 указан как часть стандарта?