@madc0de

Как правильно проверять переменную на пустоту внутри функции?

Сейчас при объявлении переменной пишу return с проверкой на пустоту иначе функция дальше выполняться не будет.
var element = document.querySelector('.domElement');
return element === undefined || element === null;


Но очень не удобно, если например много переменных и хочется объявить через запятую:
var n = document.querySelector('.domElement')
,   t = 0
,   l = 1;


Вот в примере, как правильно сделать, чтобы если элемента нету, не вернулась ошибка?
class App{
  constructor() {
     this.initCanvas();
  }
  initCanvas() {
     var element = document.querySelector('.domElement')
     ,   ctx = element.getContext('2d'); //тут будет ошибка, если такой элемента не существует
  }
}


Хотелось бы понять, как красиво, минималистично и правильно делать проверку на существование?
  • Вопрос задан
  • 99 просмотров
Пригласить эксперта
Ответы на вопрос 3
Tim-A-2020
@Tim-A-2020
1 вариант. с 2020 года
element?.getContext('2d');
2 вариант использовать тернарный оператор
element ? element.getContext('2d') : null
3 вариант
if(element && element.getContext) {
//code
}
Ответ написан
Stalker_RED
@Stalker_RED
querySelector, возвращаемое значение:
Ссылка на объект типа Element, являющийся первым элементов в документе, который соответствует указанному набору CSS селекторов, либо null, если совпадений нет
то есть проверку можно упростить до element === null, или даже до !element

пишу return с проверкой на пустоту иначе функция дальше выполняться не будет.
чтоа? Показывайте пример, звучит очень странно.

как правильно сделать, чтобы если элемента нету, не вернулась ошибка?

Можно применить try ... catch например.
Но даже если ошибка не вернется, вы не сможете сделать getContext из пустоты. То есть код все равно не будет работать, даже если вы ошибку "спрячете". Зато потом будет сложнее понять, почему оно не работает.
Ответ написан
Vlad_IT
@Vlad_IT Куратор тега JavaScript
Front-end разработчик
Вы не так много экономите символов (в плане ввода, для размеров бандла минификаторы все сами сделают), то почему не писать отдельно?
var element = document.querySelector('.domElement');
var ctx = element.getContext('2d');

На мой взгляд, это лаконичнее, легче поставить точку останова на любой переменой, добавить проверку (как в вашем случае). Да и в большинстве команд, что я работал, всегда стоит eslint правило one-var.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы