Проверка на ноль с помощью троичного оператора - PullRequest
0 голосов
/ 03 ноября 2011

В приведенном ниже коде я передаю элемент HMTL и проверяю, является ли переданный параметр пустым или нет, используя тернарный оператор. Если это не нуль, я изменяю className переданного элемента.

var changeColorTo = {

  grey: function(e){
    e ? (e.className = "grey") : "" ;
  },
  red: function(e){
    e ? (e.className = "red") : "" ;
  },
  green: function(e){
    e ? (e.className = "green") : "" ;
  },
  blue: function(e){
    e ? (e.className = "blue") : "" ;
  }
};

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

changeColorTo.grey("random");

Это не приносит никакого вреда. Но мне интересно, выше ли код правильный? Я что-то пропустил? или есть ли лучший способ добиться того же результата?

Спасибо.

Ответы [ 2 ]

3 голосов
/ 03 ноября 2011

Вы можете расширить свое состояние с e до (e && e.className). Это должно предотвратить ошибки сценария, возникающие из-за передачи случайных нежелательных или даже неэлементных узлов.

Лучше реализовать это условие как function hasClassName(e) { return ... } и использовать hasClassName(e) в качестве теста.

РЕДАКТИРОВАТЬ: заменено менее чем полностью совместимым (typeof e=="object") && ('className' in e) условием, для комментариев. См. Также Как проверить, есть ли у объекта свойство в JavaScript?

1 голос
/ 03 ноября 2011

Код, как он есть, будет работать, если вы передадите строку.Однако, если вы хотите быть уверены, что передаете только элемент DOM (лучше быть строгим), вы можете изменить свой код следующим образом:

function isNode(o){
  return (
    typeof Node === "object" ? o instanceof Node : 
    typeof o === "object" && typeof o.nodeType === "number" && typeof o.nodeName==="string"
  );
}    

function isElement(o){
  return (
    typeof HTMLElement === "object" ? o instanceof HTMLElement : //DOM2
    typeof o === "object" && o.nodeType === 1 && typeof o.nodeName==="string"
  );
}

var changeColorTo = {
    grey: function(e) {
        isNode(e) || isElement(e) ? (e.className = "grey") : "" ;
    },
    ...
}

Для получения дополнительной информации о том, как isNode и isElement работают, взгляните на этот ответ stackoverflow .Этот код также гарантирует, что вы не будете пытаться изменить атрибут className переменной null или undefined, поскольку первое условие в каждой из этих функций (o instanceof Node и o instanceof HTMLElement) не будет выполнено, чтогарантирует, что isNode и isElement вернут false для значений null и undefined.

...