Я предполагаю, что вы каждый день используете объекты и массивы в своем JavaScript.

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

Хотя мой вопрос здесь:

Оставляете ли вы запятую в конце последнего элемента перед закрытием создания объекта или массива?

Если вы не используете конечные запятые, то почему бы и нет?

Начнем с Почему вам может помочь запятая в конце

Причины оставить замыкающую запятую

Нет ложных различий

Сообщения о коммитах будут точно такими же, когда вы добавляете или удаляете элементы, т. е. никаких ложных различий 🤥

  const ACTIONS = {
    ADD_ITEM: 'ADD_ITEM',
-   UPDATE_ITEM: 'UPDATE_ITEM'
+   UPDATE_ITEM: 'UPDATE_ITEM',
+   DELETE_ITEM: 'DELETE_ITEM'
  }

Здесь у нас есть количество различий +2-1
ИЛИ

  const ACTIONS = {
    ADD_ITEM: 'ADD_ITEM',
    UPDATE_ITEM: 'UPDATE_ITEM',
+   DELETE_ITEM: 'DELETE_ITEM',
  }

И здесь у нас есть diff count +1

Какой из них вы предпочитаете в Pull/Merge Requests?

Новинки всегда в конце

Мы можем добавлять новые элементы в конец объекта или массива, а не посередине, чтобы избежать многострочных изменений 👻

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

  const ACTIONS = {
    ADD_ITEM: 'ADD_ITEM',
+   DELETE_ITEM: 'DELETE_ITEM',
    UPDATE_ITEM: 'UPDATE_ITEM'
  }

Или мы можем использовать конечные запятые и постоянно добавлять новый элемент в конец объекта.

  const ACTIONS = {
    ADD_ITEM: 'ADD_ITEM',
    UPDATE_ITEM: 'UPDATE_ITEM',
+   DELETE_ITEM: 'DELETE_ITEM',
  }

Не бойтесь сломать производство

Транспиляторы и бандлеры будут опускать запятую в конце и не нарушать производство 😉

Современный браузер не будет жаловаться на запятые в конце, поскольку это часть стандарта ES5.

Но старый браузер может жаловаться и на тот случай, до IE9.

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

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

Используйте babel-plugin-syntax-trailing-function-commas в конфигурации babel, чтобы включить запятые в конце исходного кода JavaScript.

Если вы используете Prettier, вы можете настроить следующим образом:

Возможные значения:

  • es5 только для массивов и объектов
  • none нигде, без запятых
  • и all везде, где только можно; массивы, объекты, параметры функций и т. д.

Предубеждения

Кажется, чего-то не хватает

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

Вы к этому привыкнете.

Мы привыкли писать HTML на JS, запятая перед ней — это очень маленькая вещь.

Зачем лишний персонаж даром?

Эта запятая является дополнительным символом, который бесполезен ни при каком исполнении.

Мы пишем чистый код, чтобы другие разработчики могли его понять.

Машины одинаково понимают запятую и отсутствие запятой. Тогда почему бы не помочь другим разработчикам проверить код.

использованная литература

«javascript — Являются ли конечные запятые в массивах и объектах частью спецификации? - Переполнение стека"



Почему вы должны использовать висячие запятые для многострочных выражений
У всех нас разные мнения о том, как должен выглядеть код. В большинстве случаев это вопрос предпочтений, основанный на…medium.com



Вывод

Пользы от замыкающей запятой меньше, хотя очень хорошо иметь.

Что вы думаете о конце запятых?

Дайте мне знать в комментариях 💬 или в Твиттере на @patel_pankaj_ и/или @time2hack

Если вы нашли эту статью полезной, пожалуйста, поделитесь ею с другими 🗣

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

Первоначально опубликовано на https://time2hack.com 1 сентября 2020 г.