javascript - 使用三元运算符检查 null

Question

在下面的代码中，我传递了一个 HMTL 元素，并使用三元运算符检查传递的参数是否为 null。如果它不为 null，我将更改传递元素的 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");

它不会造成任何伤害。但我想知道上面的代码正确吗？我错过了什么吗？或者有没有更好的方法来达到相同的结果？

谢谢。

Answer 1

您可以将条件从 e 扩展到 (e && e.className)。这应该可以防止由于传入随机垃圾甚至非元素节点而导致脚本错误。

更好的是，将该条件实现为 function hasClassName(e) { return ... } 并使用 hasClassName(e) 作为测试。

编辑:根据评论替换了不太完全兼容的 (typeof e=="object") && ('className' in e) 条件。另请参阅How do I check if an object has a property in JavaScript?