Question

这两段编码有什么区别？一个正在工作而一个没有按预期工作..（这正在工作）

function classchange(e) {
      var elems = document.querySelector(".active");
      if (elems !== null) {
        elems.classList.remove("active");   
      }
      this.querySelector("a").classList.add("active");          
    }

（这不起作用）

function classchange(e) {
      var elems = document.querySelector(".active");
      (elems !== null) ? elems.classList.remove("active") : this.querySelector("a").classList.add("active")
}

尽管我认为这两段代码做同样的事情。

Answer 1

我认为这两段代码具有相同的作用

他们没有。在第一个中，此行始终执行：

this.querySelector("a").classList.add("active");

在第二个条件中，它仅在条件为false时执行。

但更重要的是... 这是一个常见的误解，但三元条件运算符不能替代if / else结构。它用于有条件地产生一个值，而不是有条件地执行代码块。如果要有条件地执行代码块，请使用if语句。上面的第一个示例（“有效”的示例）是正确的方法。

Answer 2

第一个不是if-else语句。只是，如果。第二个是if-else语句。因此，这两个代码并不相同。

Answer 3

在这种形式下，第二种情况（使用conditional or also known as the ternary operator）等于：

function classchange(e) {
  var elems = document.querySelector(".active");
  if(elems !== null) 
    elems.classList.remove("active") 
  else  // <-- notice the else here
    this.querySelector("a").classList.add("active")
}

三元运算符的语法为：condition ? expression If True : expression If False

如您所见，这显然不同于：

function classchange(e) {
  var elems = document.querySelector(".active");
  if (elems !== null) {
    elems.classList.remove("active");   
  }  // <-- no else here
  this.querySelector("a").classList.add("active");          
}

没有else的地方，我们最终执行this.querySelector("a").classList.add("active");

如果else语句在一行中是什么问题

3 个答案: