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

Для начала, что такое ECMAScript 6?

Было время, еще в 1997 году, когда JavaScript принял недавно созданный стандарт, известный как ECMAScript, созданный организацией, известной как Ecma International.

Двигаясь в будущее, стандарт претерпел множество изменений, последний из которых был выпущен в июне 2009 года, ECMAScript 5.

В очередной раз, в июне этого года, ECMAScript 6 (или просто ES6) был опубликован и принят JavaScript. Другими словами, все новые функции!

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

Это действительно работает?

В настоящее время JavaScript используется на огромном количестве интернет-страниц, поэтому изменить его не так-то просто. Более того, современным браузерам приходится иметь дело с внутренними модификациями, чтобы применить возможности нового стандарта, поэтому нам нужно подождать, пока будут готовы их новые реализации, прежде чем мы сможем использовать ECMAScript 6 в полной мере.

Но не бойтесь! Вы по-прежнему можете использовать предыдущий стандарт ECMAScript 5 благодаря обратной совместимости ES6. Таким образом, ваши старые приложения, написанные на ES5, все еще будут работать, когда над нами воцарится новый стандарт.

Потому что новое всегда лучше. Шучу, за исключением этого случая, это действительно так! Кроме того, благодаря транскомпиляторам, таким как Babel, вы всегда можете преобразовать весь свой код с ES6 в ES5 в любое время (ура, обратная переносимость!).

Итак, приступайте к изучению нового стандарта прямо сейчас, чтобы в полной мере использовать новые функции и изменения, но не забывайте о своих корнях… ES5 по-прежнему используется во всем мире, и так будет еще много лет.

Итак, что нового?

Как упоминалось ранее, ES6 вносит множество изменений. Некоторые из них:

область видимости блока,
циклы for..of,
генераторы,
итераторы,
классы,
модули,
стрелочные функции,
двоичные данные,
обещания,
коллекции и
прокси.

Все эти функции, очевидно, обратно совместимы. С точки зрения непрофессионала, эти функции подобны хлебу. Буханка хлеба может быть единственной функцией, которую мы используем в ES6, но ее можно разделить на отдельные ингредиенты и создать в ES5. На самом деле это то, что делает транскомпилятор, и то, что делает ES6, связано с тем, что известно как сделать синтаксис более приятным в мире программирования.

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

В этой статье мы рассмотрим лишь некоторые из них, начиная с обзора блоков. Кстати, вы можете попробовать все наши сниппеты в es6fiddle, просто скопируйте и вставьте код.

Область переменной – это область, в которой ее привязка действительна, т. е. где эту переменную можно использовать. Обычно единственный способ объявить переменные в JavaScript — использовать ключевое слово var, которое устанавливает область действия на уровне функции (или глобальную). Это может немного сбить с толку программистов, имеющих опыт работы с такими языками, как C++ или Java, где область видимости блока — это путь.

Вот где ES6 сияет, добавляя ключевые слова let, которые позволяют вам объявить реальнуюпеременную области блока; и const, который следует тем же правилам, что и первый, за исключением того, что значение неизменяемо, поэтому мы можем назначить его только один раз.

Строки шаблона

Больше никакой ручной интерполяции для получения удобочитаемого текста, поскольку теперь мы можем комбинировать строковые переменные, используя строки-шаблоны:

Значения параметров по умолчанию

Простые и интуитивно понятные значения по умолчанию для параметров функций, как в C++ и Python:

Представляем для..из

В отличие от for..in, который выполняет итерацию по именам свойств объекта, for..of выполняет итерации по значениям свойств. >. Это дает вам еще один способ перебирать итерируемые объекты.

Генераторы

Эти функции-генераторы определяются с помощью ключевого слова function* (да, со звездочкой) и возвращают объект Generator. Основной синтаксис можно увидеть здесь, но он примерно такой:

Эти функции-генераторы определяются с помощью ключевого слова function* и возвращают объект Generator. Основной синтаксис можно увидеть здесь, но он примерно такой:

Хотя они выглядят как обычные функции, они работают совершенно по-другому.

Когда вы впервые используете генератор, он не выполняет свое тело. Вместо этого он возвращает объект итератора для этой функции.
Каждый раз, когда вызывается метод next() генератора, функция выполняется до тех пор, пока внутри нее не встретится ключевое слово yield в первый раз. . В этот момент метод возвращает объект с двумя атрибутами: value (значение рядом с yield) и done. (указывает, завершилось ли выполнение функции).
Когда вы снова используете метод next(), он начнется с того места, откуда он ушел, а параметр, который вы ему передадите, заменит ключевое слово yield предыдущего возвращаемого значения. .

Пример:

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

Подведение итогов

В этой статье мы постарались осветить некоторые из наиболее полезных, на наш взгляд, дополнений, включаемых в ES6. Мы можем обновить этот список в будущем, поскольку мы продолжаем использовать новый стандарт, и мы приветствуем любые ваши предложения.

Если вам нравится то, что вы читаете, и вы хотели бы работать с нами, напишите на работу в monits dot com с темой «Среда — возможность трудоустройства».

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