javascript - Javascript 中的 FizzBuzz 程序（已给出详细信息）

Question

有人可以为FizzBuzz更正我的这段代码吗？似乎有一个小错误。下面的代码打印所有数字，而不是只打印不能被 3 或 5 整除的数字。

编写一个程序，打印从1到的数字100。但是对于三的倍数，打印"Fizz"而不是数字，对于五的倍数，打印"Buzz"。对于同时是 3 和 5 的倍数的数字，打印"FizzBuzz".

function isDivisible(numa, num) {
  if (numa % num == 0) {
    return true;
  } else {
    return false;
  }
};

function by3(num) {
  if (isDivisible(num, 3)) {
    console.log("Fizz");
  } else {
    return false;
  }
};

function by5(num) {
  if (isDivisible(num, 5)) {
    console.log("Buzz");
  } else {
    return false;
  }
};

for (var a=1; a<=100; a++) {
  if (by3(a)) {
    by3(a);
    if (by5(a)) {
      by5(a);
      console.log("\n");
    } else {
      console.log("\n");
    }
  } else if (by5(a)) {
    by5(a);
    console.log("\n");
  } else {
    console.log(a+"\n")
  }
}

score 73 · Accepted Answer

for (let i = 1; i <= 100; i++) {
    let out = '';
    if (i % 3 === 0) out += 'Fizz';
    if (i % 5 === 0) out += 'Buzz';
    console.log(out || i);
}

score 8 · Accepted Answer

/*Write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz”*/

var str="",x,y,a;
for (a=1;a<=100;a++)
{
    x = a%3 ==0;
    y = a%5 ==0;
    if(x)
    {
        str+="fizz"
    }
    if (y)
    {
        str+="buzz"
    }
    if (!(x||y))
    {
        str+=a;
    }
    str+="\n"
}
console.log(str);

无论如何，您的函数都会返回虚假值，但无论如何都会打印。没有必要让这过于复杂。

小提琴：http: //jsfiddle.net/ben336/7c9KN/

score 8 · Accepted Answer

与 C# 相比，在玩弄 FizzBuzz 和 JavaScript。

这是我的版本，深受更多rigid语言的影响：

function FizzBuzz(aTarget) {
    for (var i = 1; i <= aTarget; i++) {
        var result = "";
        if (i%3 === 0) result += "Fizz";        
        if (i%5 === 0) result += "Buzz";
        if (result.length ===0) result = i;

        console.log(result);
    }
}

我喜欢结构和易于阅读。

现在，Trevor Dixon巧妙地利用语言的 false-y 值（false、null、undefined、''（空字符串）0和NaN（非数字））来缩短代码。
现在，该if (result.length ===0) result = i;行是多余的，代码将如下所示：

function FizzBuzz(aTarget) {
    for (var i = 1; i <= aTarget; i++) {
        var result = "";
        if (i%3 === 0) result += "Fizz";        
        if (i%5 === 0) result += "Buzz";

        console.log(result || i);
    }
}

在这里，我们让||操作员说：“如果result为假，则打印迭代值 ( i)”。很酷的把戏，我想我需要更多地使用 JavaScript 来吸收这个逻辑。

您可以看到其他示例（来自GitHub），其范围包括：

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

这里没有变量，只检查除以 15,3 和 5（我上面的一个只除以 3 和 5，但有一个额外的变量，所以我想这取决于那些关心或风格偏好的人的微基准测试）。

到：

for(i=0;i<100;)console.log((++i%3?'':'Fizz')+(i%5?'':'Buzz')||i)

这一切都在线完成，基于0一个错误值的事实，因此除了我们之前看到的技巧之外，您还可以将其用于if-else简写版本 ( )。? :||

这是上面的一个更易读的版本，带有一些变量：

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);
}

总而言之，你可以用不同的方式来做这件事，我希望你能学到一些在 JavaScript 中使用的好技巧 :)

score 4 · Accepted Answer

.fizz并且.buzz可能是 CSS 类，不是吗？在这种情况下：

var n = 0;
var b = document.querySelector("output");
window.setInterval(function () {
    n++;
    b.classList[n%3 ? "remove" : "add"]("fizz");
    b.classList[n%5 ? "remove" : "add"]("buzz");
    b.textContent = n;
}, 500);

output.fizz:after {
    content: " fizz";
    color:red;
}

output.buzz:after {
    content: " buzz";
    color:blue;
}

output.fizz.buzz:after {
    content: " fizzbuzz";
    color:magenta;
}

<output>0</output>

score 3 · Accepted Answer

使用三元运算符非常简单：

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

score 2 · Accepted Answer

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

score 1 · Accepted Answer

在你的by3andby5函数中，你隐式地返回undefined它是否适用，false如果它不适用，但你的if语句正在测试，好像它返回了trueor false。true如果适用，请明确返回，以便您的if语句将其选中。

score 1 · Accepted Answer

Codeacademy 今晚向我发出了 FizzBuzz。我有一个模糊的记忆，它是“一件事”，所以我做了这个。也许不是最好的方法，但与上述不同：

var data = {
    Fizz:3,
    Buzz:5
};

for (var i=1;i<=100;i++) {
    var value = '';
    for (var k in data) {
        value += i%data[k]?'':k;
    }
    console.log(value?value:i);
}

它依赖于数据而不是代码。我认为，如果这种方法有一个优势，那就是您可以在不添加额外逻辑的情况下使用 FizzBuzzBing 3 5 7 或更远，前提是您按照规则指定的顺序分配对象元素。例如：

var data = {
    Fizz:3,
    Buzz:5,
    Bing:7,
    Boom:11,
    Zing:13
};

for (var i=1;i<=1000;i++) {
    var value = '';
    for (var k in data) {
        value += i%data[k]?'':k;
    }
    console.log(value?value:i);
}

score 1 · Accepted Answer

作为 ES6 生成器：http: //www.es6fiddle.net/i9lhnt2v/

function* FizzBuzz() {

    let index = 0;

    while (true) {

        let value = ''; index++;

        if (index % 3 === 0) value += 'Fizz';
        if (index % 5 === 0) value += 'Buzz';

        yield value || index;

    }

}

let fb = FizzBuzz();
for (let index = 0; index < 100; index++) {
    console.log(fb.next().value);
}

score 1 · Accepted Answer

这是我写的：

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

score 1 · Accepted Answer

for (var 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);    
}

FizzBuzz 的最简单方法之一。3 和 5 的倍数同时表示 15 的倍数。

第二个版本：

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

score 1 · Accepted Answer

如果有人正在寻找其他解决方案：这是一个纯、递归和可重用的函数，具有可选的可自定义参数值：

const fizzBuzz = (from = 1, till = 100, ruleMap = {
  3: "Fizz",
  5: "Buzz",
}) => from > till || console.log(
  Object.keys(ruleMap)
    .filter(number => from % number === 0)
    .map(number => ruleMap[number]).join("") || from
) || fizzBuzz(from + 1, till, ruleMap);

// Usage:
fizzBuzz(/*Default values*/);

from > till是打破递归的锚。因为它返回false直到from高于till，所以它转到下一条语句 ( console.log)：
Object.keysruleMap在给定的情况下返回一个对象属性数组，3默认5情况下在我们的例子中。
- 然后，它遍历数字并仅返回可被from（0 作为余数）整除的数字。
- 然后，它对过滤后的数字进行迭代，并根据规则输出说法。
- 但是，如果该filter方法返回一个空数组（[]，没有找到结果），它只输出当前from值，因为最后的join方法最终只返回一个空字符串（""），它是一个假值。
由于console.log总是返回undefined，它转到下一条语句并再次调用自身，将from值递增1。

score 1 · Accepted Answer

FizzBuzz 的功能版本

const dot = (a,b) => x => a(b(x));
const id = x => x;


function fizzbuzz(n){
  const f = (N, m) => n % N ? id : x => _ => m + x('');
  return dot(f(3, 'fizz'), f(5, 'buzz')) (id) (n);
}

对于上面的更多选项，用点替换点，如下所示

const dots = (...a) => f0 => a.reduceRight((acc, f) => f(acc), f0);

function fizzbuzz(n){
  const f = (N, m) => n % N ? id : x => _ => m + x('');
  return dots(f(3, 'fizz'), f(5, 'buzz'), f(7, 'bam')) (id) (n);
}

参考：FizzBuzz in Haskell by Embedding a Domain-Specific Language by Maciej Piro ́g

score 0 · Accepted Answer

for (i=1; i<=100; i++) {
  output = "";
  if (i%5==0) output = "buzz"; 
  if (i%3==0) output = "fizz" + output;
  if (output=="") output = i;
  console.log(output);
}

score 0 · Accepted Answer

功能风格！ JSBin 演示

// create a iterable array with a length of 100
// and map every value to a random number from 1 to a 100
var series = Array.apply(null, Array(100)).map(function() {
  return Math.round(Math.random() * 100) + 1;
});

// define the fizzbuzz function which takes an interger as input
// it evaluates the case expressions similar to Haskell's guards
var fizzbuzz = function (item) {
  switch (true) {
    case item % 15 === 0:
      console.log('fizzbuzz');
      break;
    case item % 3 === 0:
      console.log('fizz');
      break;
    case item % 5 === 0:
      console.log('buzz');
      break;
    default:
      console.log(item);
      break;
  }
};

// map the series values to the fizzbuzz function
series.map(fizzbuzz);

score 0 · Accepted Answer

另一种解决方案，避免过度划分并消除“Fizz”和“Buzz”之间的多余空间：

    var num  = 1;
    var FIZZ = 3;   // why not make this easily modded?
    var BUZZ = 5;   // ditto
    var UPTO = 100; // ditto
                    // and easily extended to other effervescent sounds

    while (num < UPTO)
    {
        var flag = false;
        if (num % FIZZ == 0) { document.write ("Fizz"); flag = true; }
        if (num % BUZZ == 0) { document.write ("Buzz"); flag = true; }
        if (flag == false)   { document.write (num); }
        document.write ("<br>");
        num += 1;
    }

如果您使用的是 jscript/jsc/.net，请使用 Console.Write()。如果您使用的是 Node.js，请使用 process.stdout.write()。不幸的是，console.log() 附加换行符并忽略退格，因此它不能用于此目的。您也可以附加到字符串并打印它。（我是一个完整的 n00b，但我认为（好吧，希望）我已经相当彻底。）

“先生们，你们怎么想？”

score 0 · Accepted Answer

这就是我是怎么做到的：

不是最好的代码，但确实成功了

var numbers = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20];

for(var i = 0 ; i <= 19 ; i++){

  var fizz = numbers[i] % 3 === 0;
  var buzz = numbers[i] % 5 === 0;
  var fizzBuzz = numbers[i] % 5 === 0 && numbers[i] % 3 === 0;

  if(fizzBuzz){
    console.log("FizzBuzz");
  } else if(fizz){
    console.log("Fizz");
  } else if(buzz){
    console.log("Buzz");
  } else {
    console.log(numbers[i]);
  }

}

score 0 · Accepted Answer

看一下这个！

function fizzBuzz(){
    for(var i=1; i<=100; i++){
        if(i % 3 ===0 && i % 5===0){
            console.log(i+' fizzBuzz');
        } else if(i % 3 ===0){
            console.log(i+' fizz');
        } else if(i % 5 ===0){
            console.log(i+' buzz');
        } else {
            console.log(i);
        }
    } 
}fizzBuzz();

score 0 · Accepted Answer

实现方式略有不同。

您可以将自己的参数放入函数中。可以是非连续数字，例如 [0, 3, 10, 1, 4]。默认设置仅为 1-15。

function fizzbuzz (set) {
  
  var set = set ? set : [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
  var isValidSet = set.map((element) => {if (typeof element !== 'number') {return false} else return true}).indexOf(false) === -1 ? true : false
  var gotFizz = (n) => {if (n % 3 === 0) {return true} else return false}
  var gotBuzz = (n) => {if (n % 5 === 0) {return true} else return false}
  
  if (!Array.isArray(set)) return new Error('First argument must an array with "Number" elements')
  if (!isValidSet) return new Error('The elements of the first argument must all be "Numbers"')

  set.forEach((n) => {

    if (gotFizz(n) && gotBuzz(n)) return console.log('fizzbuzz')
    if (gotFizz(n)) return console.log('fizz')
    if (gotBuzz(n)) return console.log('buzz')
    else return console.log(n)
  })
}

score 0 · Accepted Answer

var num = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20];

var runLoop = function() {
for (var i = 1; i<=num.length; 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);
    }
}
};
runLoop();

score 0 · Accepted Answer

只想分享我的解决方法

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);
  }
}

score 0 · Accepted Answer

var limit = prompt("Enter the number limit");
var n = parseInt(limit);
var series = 0;
for(i=1;i<n;i++){    
  series = series+" " +check();
}

function check() {
  var result;
  if (i%3==0 && i%5==0) {  // check whether the number is divisible by both 3 and 5
    result = "fizzbuzz "; // if so, return fizzbuzz
    return result;
  }
  else if (i%3==0) {  // check whether the number is divisible by 3 
    result = "fizz ";  // if so, return fizz
    return result;
  }
  else if (i%5==0) {  // check whether the number is divisible by 5
    result = "buzz ";  // if so, return buzz
    return result;
  }
  else return i;  // if all the above conditions fail, then return the number as it is
}

alert(series);

score 0 · Accepted Answer

尽管这是一个简单的逻辑，但对于初学者来说可能是一项艰巨的任务。以下是我对FizzBuzz问题的解决方案：

let i = 1;
while(i<=100){
    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);
    }
    i++;
}

score 0 · Accepted Answer

考虑到性能和可读性，请找到我对这个问题的看法

方式 1：而不是在 if 循环中执行数学模块操作，这会导致执行 3 次，将其上一步减少开销

function fizzBuzz(n) {
    let count =0;
    let x = 0;
    let y = 0;
    while(n!==count)
    {
        count++;
        x = count%3;
        y = count%5;
        if(x === 0 && y ===0)
        {
            console.log("fizzbuzz");
        }
        else if(x === 0)
        {
            console.log("fizz");
        }
        else if(y === 0)
        {
            console.log("buzz");
        }
        else
        {
            console.log(count);
        }
    }
}

fizzBuzz(15);

方式2：浓缩溶液

function fizzBuzz(n) {
    let x = 0;
    let y = 0;
    for (var i = 1; i <= n; i++) {
        var result = "";
        x = i%3;
        y = i%5;
        if (x === 0 && y === 0) result += "fizzbuzz";  
        else if (x === 0) result += "fizz";        
        else if (y === 0) result += "buzz";

        console.log(result || i);
    }
}

fizzBuzz(5)

score 0 · Accepted Answer

这是我最喜欢的解决方案。简洁、实用、快速。

const oneToOneHundred = Array.from({ length: 100 }, (_, i) => i + 1);

const fizzBuzz = (n) => {
  if (n % 15 === 0) return 'FizzBuzz';
  if (n % 3 === 0) return 'Fizz';
  if (n % 5 === 0) return 'Buzz';
  return n;
};

console.log(oneToOneHundred.map((i) => fizzBuzz(i)).join('\n'));

score 0 · Accepted Answer

function fizzBuzz(n) {
  for (let i = 1; i < n + 1; i++) {
    if (i % 15 == 0) {
      console.log("fizzbuzz");
    } else if (i % 3 == 0) {
      console.log("fizz");
    } else if (i % 5 == 0) {
      console.log("buzz");
    } else {
      console.log(i);
    }
  }
}

fizzBuzz(15);

score -1 · Accepted Answer

不一样的功能风格——naive

fbRule = function(x,y,f,b,z){return function(z){return (z % (x*y) == 0 ? f+b: (z % x == 0 ? f : (z % y == 0  ? b: z)))  }}

range = function(n){return Array.apply(null, Array(n)).map(function (_, i) {return i+1;});}

range(100).map(fbRule(3,5, "fizz", "buzz"))

或者，合并上面例子中的结构：即 [[3, "fizz"],[5, "buzz"], ...]

fbRule = function(fbArr,z){
  return function(z){
    var ed = fbArr.reduce(function(sum, unit){return z%unit[0] === 0 ? sum.concat(unit[1]) : sum }, [] )
    return ed.length>0 ? ed.join("") : z
  }
} 

range = function(n){return Array.apply(null, Array(n)).map(function (_, i) {return i+1;});}

range(100).map(fbRule([[3, "fizz"],[5, "buzz"]]))

或者，使用 ramda [来自https://codereview.stackexchange.com/questions/108449/fizzbuzz-in-javascript-using-ramda ]

var divisibleBy = R.curry(R.compose(R.equals(0), R.flip(R.modulo)))
var fizzbuzz =  R.map(R.cond([
  [R.both(divisibleBy(3), divisibleBy(5)), R.always('FizzBuzz')],
  [divisibleBy(3), R.aklways('Fizz')],
  [divisibleBy(5), R.always('Buzz')],
  [R.T, R.identity]
]));

console.log(fizzbuzz(R.range(1,101)))

javascript - Javascript 中的 FizzBu​​zz 程序（已给出详细信息）

27 回答 27

Related

Reference

javascript - Javascript 中的 FizzBuzz 程序（已给出详细信息）