1. Гарантированная обязательность параметра с помощью параметра по умолчанию

Значения параметров по умолчанию в ES6 вычисляются только тогда, когда действительно используются. Это позволяет нам обеспечить обязательность параметра:

/**
 * Вызовется, если параметр не передан
 * и используется параметр по умолчанию.
 */function mandatory() {    throw new Error('Missing parameter');}function foo(mustBeProvided = mandatory()) {    return mustBeProvided;}

Вызов функции mandatory() делает параметр mustByProvided обязательным. Пример:

> foo()Error: Missing parameter> foo(123)123

Больше информации:

• Раздел “Required parameters” в “Exploring ES6”

2. Получение индексов и значений массива в цикле for-of

Метод forEach позволяет пройтись по списку элементов массива. Также он позволяет получить индекс каждого элемента, если это необходимо:

var arr = ['a', 'b', 'c'];arr.forEach(function (elem, index) {    console.log('index = '+index+', elem = '+elem);});// Output:// index = 0, elem = a// index = 1, elem = b// index = 2, elem = c

В ES6 цикл for-of поддерживает ES6 итерации (итерируемые структуры данных и итераторы) и деструктуризацию. Если скомбинировать деструктуризацию и метод массива entries(), получим:

const arr = ['a', 'b', 'c'];for (const [index, elem] of arr.entries()) {    console.log(`index = ${index}, elem = ${elem}`);}

Метод arr.entries() возвращает итерируемые пары индекс-элемент. Деструктуризация [index, elem] дает доступ к каждому элементу пары. Параметр функции console.log называется литералом шаблона, который дает строковую интерполяцию в JavaScript.

Больше информации:

• Глава “Destructuring” в “Exploring ES6”
• Глава “Iterables and iterators” в “Exploring ES6”
• Раздел “Iterating with a destructuring pattern” в “Exploring ES6”
• Раздел “Template literals” в “Exploring ES6”

Некоторые кодовые единицы Unicode (грубо говоря, символы) содержат два символа JavaScript.

Строки поддерживают ES6 итерацию. Если итерировать по строке, получим кодовые единицы (один или два символа JavaScript). Например:

for (const ch of 'x\uD83D\uDE80y') {    console.log(ch.length);}// Output:// 1// 2// 1

Это дает возможность посчитать количество кодовых единиц в строке:

> [...'x\uD83D\uDE80y'].length3

Оператор расширения (...) добавляет элементы операнда в массив.

Больше информации:

• Глава “Unicode in ES6” в “Exploring ES6”
• Раздел “The spread operator (...)” в “Exploring ES6”

4. Обмен значений переменных с помощью деструктуризации

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

[a, b] = [b, a];

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

Больше информации:

• Глава “Destructuring” из Exploring ES6

5. Простой шаблонизатор с помощью литерала шаблона

Литералы шаблонов в ES6 больше похожи на обычные строковые литералы, чем на традиционные текстовые шаблоны. Но литералы шаблона можно использовать как шаблоны, если вернуть их из функции:

const tmpl = addrs => `
    <table>
    ${addrs.map(addr => `        <tr><td>${addr.first}</td></tr>        <tr><td>${addr.last}</td></tr>    `).join('')}    </table>`;

Функция tmpl (стрелочная функция) принимает массив addrs, а возвращает строку. Давайте используем tmpl() с массивом data:

const data = [    { first: '', last: 'Bond' },    { first: 'Lars', last: '' },];console.log(tmpl(data));// Output:// <table>////     <tr><td><Jane></td></tr>//     <tr><td>Bond</td></tr>////     <tr><td>Lars</td></tr>//     <tr><td><Croft></td></tr>//// </table>

Больше информации:

• Запись в блоге “Handling whitespace in ES6 template literals”
• Раздел “Text templating via untagged template literals” в “Exploring ES6”
• Глава “Arrow functions” в “Exploring ES6”

6. Простой миксин с помощью фабрики дочерних классов

Если класс ES6 расширяет другой класс, родительский класс задается динамически, с помощью произвольного выражения (не статически с помощью идентификатора):

// Function id() simply returns its parameterconst id = x => x;    class Foo extends id(Object) {}

Это позволяет реализовать миксин как функцию, отображающую класс C в новый класс, наследующийся от C и имеющий подмешанные методы. Например, функции Storage и Validation, приведенные ниже, являются миксинами:

const Storage = Sup => class extends Sup {        save(database) { ··· }};const Validation = Sup => class extends Sup {    validate(schema) { ··· }};

Их можно использовать для создания класса Employee:

class Person { ··· }class Employee extends Storage(Validation(Person)) { ··· }

Больше информации:

• Раздел “Simple mixins” в “Exploring ES6”

Дополнительное чтение

Следующие две главы дают хороший обзор ECMAScript 6:

• An overview of what’s new in ES6
• First steps with ECMAScript 6

Источник: http://getinstance.info/articles/javascript/six-nifty-es6-tricks/