javascript FizzBu​​zz / if else语句

Question

以下是代码：

var i = 0;
for (i = 1; i <= 20; i++) {
    if (i % 5 === 0 && i % 3 === 0) {
        console.log("FizzBuzz");
    } else if (i % 5 === 0) {
        console.log("Buzz");
    } else if (i % 3 === 0) {
        console.log("Fizz");
    } else {
        console.log(i);
    }
}

，这是输出：

1
2
Fizz
4
Buzz
Fizz
7
8
Fizz
Buzz
11
Fizz
13
14
FizzBuzz
16
17
Fizz
19
Buzz

代码还可以，效果很好但是我不明白为什么它只在逻辑运算符＆amp;＆amp;是FizzBuzz语句，而不是if？

Answer 1

一旦if (...) / else if (...)中的一个条件为true（从上到下），其余条件就不会被评估，程序会进入下一个循环（下一个i）值。

如果您更换订单：

var i = 0;
for (i = 1; i <= 20; i++) {
    if (i % 5 === 0) {
        // This evaluates to true for a number that is multiple of 5 and 3, and it prints "Buzz", and goes into the next loop.
        console.log("Buzz");
    } else if (i % 5 === 0 && i % 3 === 0) {
        console.log("FizzBuzz");
    } else if (i % 3 === 0) {
        console.log("Fizz");
    } else {
        console.log(i);
    }
}

如果您正在寻找更短版本的FizzBu​​zz，这是Paul Irish的一个有趣的答案（为了清晰起见，添加了更多括号）：

for (var i = 1; i <= 100; i++) {
    var f = i % 3 == 0, b = i % 5 == 0;
    console.log(f ? (b ? "FizzBuzz" : "Fizz") : (b ? "Buzz" : i));
}

来源：https://gist.github.com/jaysonrowe/1592432#gistcomment-790724

Answer 2

这是 else if 语句的正确方法：

for(i = 1; i <= 100; i++){
 if (i % 3 === 0 && i % 5 === 0) {
    console.log('FizzBuzz');
  } else if(i % 3 == 0){
    console.log('Fizz'); 
  } else if (i % 5 == 0){
    console.log('Buzz');
  } else {
    console.log(i);
  }
}

带有 switch 语句的另一种解决方案：

for(i = 1; i <= 100; i++){
 switch (true) {
  case (i % 3 === 0 && i % 5 === 0) :
    console.log('FizzBuzz');
    break;
  case (i % 3 == 0) :
    console.log('Fizz');
    break;
  case (i % 5 == 0) :
    console.log('Buzz');
    break;
  default:
    console.log(i);
    break;
  } 
}