Подписывайтесь на мой твиттер, там всегда что-нибудь интересное!

Замыкающие запятые (Trailing Commas) в JavaScript ES 2017

Маленькая, но уж очень полезная статья о том, как использовать замыкающие запятые в JavaScript.

Кто-то называет их просто Trailing Commas, без перевода. Кто-то говорит, что это висящие запятыеконечные запятые или последние запятые. Слышал даже, что её называют гуляющей запятой. Я же сторонник более подходящего варианта в техническом отношении, а именно за замыкающую запятую. Использование англоязычного варианта мне кажется неуместным в этом случае.

Перевод статьи Learn JavaScript ES 2017 — Trailing Commas

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

Что такое замыкающая запятая и почему она полезна?

Предположим, что у вас есть список домашних дел и вы скорее всего разделяете эти самые дела запятыми:

dishes, vacuum, tidy

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

dishes, vacuum, tidy,

И знаете, есть несколько случаев, когда вам всё таки понадобится её использовать. Предположим, что вам надо программно добавлять элементы в массив:

Без замыкающей запятой большинство значений может быть добавлено в массив, как value + ','. Но тут надо немного доработать логику в коде и убедиться в том, что последний элемент будет добавлен в массив без запятой в конце.

С замыкающей запятой, все элементы могут быть добавлены в массив, как value + ','.

Массивы

С самого зарождения JavaScript, замыкающие запятые можно было использовать при создании массивов:

// Оба варианта одинаковы:
let arr = [ 1, 2 ];
let arr = [ 1, 2 , ];
arr.length; // 2

Объекты

Замыкающие запятые также вполне можно использовать и в объектах:

// Оба варианта одинаковы:
let obj = { 
  a: 95, 
  b: 23
};
let obj = { 
  a: 95, 
  b: 23,
};

Указание параметров и вызовы функции

Начиная с ES 2017, замыкающие запятые можно использовать в указании параметров и вызовах функции:

// Оба варианта одинаковы:
function f(a,b) {}
function f(a,b,) {}
// Оба варианта одинаковы:
f(1,2);
f(1,2,);

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

function f(,) {}; 
// SyntaxError: missing formal parameter
f(,); 
// SyntaxError: expected expression, got ','

Rest параметры

При использовании rest параметров нельзя применять замыкающие запятые, так как получите в ответ SyntaxError:

function f(...a,) {};
// SyntaxError: parameter after rest parameter
let [a, ...b,] = [1, 2, 3, 4, 5];
// SyntaxError: rest element may not have a trailing comma

JSON

В JSON нельзя использовать замыкающие запятые. Попытаясь спарсить JSON с такой запятой, вы получите синтаксическую ошибку:

JSON.parse('["a", "b",]');
// SyntaxError JSON.parse: unexpected character