Тернарное условие после объявления переменной считается плохой практикой при использовании StandardJS - PullRequest
0 голосов
/ 04 июня 2018

Я столкнулся с несколько запутанной проблемой при использовании стандарта JS (без точек с запятой), и я думаю, что я делаю что-то не так со следующим кодом:

window.onload = function () {
  var menu = document.getElementById('menu')
  (window.pageYOffset > 10)
    ? menu.classList.add('scrolled')
    : menu.classList.remove('scrolled')
}

, который производит document.getElementById is not a function ошибка в консоли, и добавление точки с запятой в конце объявления var исправляет ее.Я хотел бы знать, если приведенный выше код не является хорошим шаблоном или неправильным в какой-то момент, если используется стандарт кодирования JS.

ОБНОВЛЕНИЕ: Хорошо, так что я думаю,стандартный способ сделать следующее было бы следующим:

  var menu = document.getElementById('menu')
  ;(window.pageYOffset > 10)
    ? menu.classList.add('scrolled')
    : menu.classList.remove('scrolled')

Ссылка: https://standardjs.com/rules.html#semicolons

Ответы [ 2 ]

0 голосов
/ 15 февраля 2019

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

var menu = document.getElementById('menu')
menu.classList[window.pageYOffset > 10 ? 'add' : 'remove']('scrolled')

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

0 голосов
/ 04 июня 2018

Проблема заключается в том, как JS должен интерпретировать ваш код без точек с запятой здесь:

var menu = document.getElementById('menu')
(window.pageYOffset > 10)
    ? menu.classList.add('scrolled')
    : menu.classList.remove('scrolled')

После удаления пробелов вы можете реорганизовать его следующим образом:

var menu = document.getElementById('menu')(window.pageYOffset > 10)
    ? menu.classList.add('scrolled')
    : menu.classList.remove('scrolled');

Так что теперь JSпопытается вызвать not-a-function document.getElementById('menu') как функцию, чтобы увидеть, возвращает ли она значение, а затем оценить if, и в этот момент выскочит ошибка.

...