Javascript中的FizzBu​​zz程序（详细说明）

Question

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

  

编写一个程序，打印从1到100的数字。但是对于三的倍数，请打印"Fizz"而不是数字，打印为"Buzz"的倍数为五的倍数。对于三和五的倍数的数字，请打印"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")
  }
}

Answer 1

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

有点发烧友，允许进行一些配置：

function* fizzBuzz(max = 100, config = [[3, 'Fizz'], [5, 'Buzz']]) {
  for (let i = 1; i <= max; i++) {
    let out = '';
    for (let [n, str] of config) {
      if (i % n === 0) out += str;
    }
    yield out || String(i);
  }
}

const iter = fizzBuzz(100, [
  [3, 'Fizz'],
  [9, 'Bang'],
  [15, 'Buzz'],
]);
for (const out of iter) {
  document.write(`<li>${out}`);
}

Answer 2

/*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/

Answer 3

与C＃相比，正在使用FizzBu​​zz和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 巧妙地做了什么，转发语言的假y值（false，null，undefined，{{1 （空字符串），''和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); } } 运算符上转发说：“如果||为false，则打印迭代值（result）”。很酷的技巧，我想我需要更多地使用JavaScript来吸收这种逻辑。

您可以看到其他示例（来自GitHub），其中包括以下内容：

i

这里没有变数，只需检查除以15,3＆amp; 5（我上面的一个只划分3和5，但是有一个额外的变量，所以我想这可以归结为那些关心或风格偏好的微基准测试。）

要：

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

这一切都在线，转发for(i=0;i<100;)console.log((++i%3?'':'Fizz')+(i%5?'':'Buzz')||i) 是假值的事实，因此您可以将其用于0缺少版本（if-else），此外我们之前见过的? :诀窍。

以上是上述更具可读性的版本，包含一些变量：

||

总而言之，你可以用不同的方式做到这一点，我希望你能在JavaScript中找到一些漂亮的技巧：）

Answer 4

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

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

Answer 5

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

Answer 6

这就是我写的：

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

Answer 7

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

FizzBu​​zz最简单的方法之一。 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);    
}

Answer 8

在by3和by5函数中，如果适用，则隐式返回undefined;如果不适用，则隐式返回false，但if声明为true测试就像它返回false或true一样。如果适用，请明确返回if，以便{{1}}语句选择它。

Answer 9

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

Answer 10

Codeacademy今晚在我身上掀起了一场FizzBu​​zz。我有一个模糊的记忆，它是“一件事”，所以我这样做了。也许不是最好的方式，但与上述不同：

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

它依赖于数据而不是代码。我认为如果这种方法有优势的话，只要您按照规则指定的顺序分配对象元素，就可以在不添加额外逻辑的情况下进入FizzBu​​zzBing 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);
}

Answer 11

功能风格！ JSBin Demo

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

Answer 12

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

Answer 13

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

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

Answer 14

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

方法1：与其在if循环中执行数学模块运算，不如在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)

Answer 15

尽管这是简单的逻辑，但对于初学者来说却是艰巨的任务。以下是我针对 FizzBu​​zz 问题的解决方案：

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

Answer 16

.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>

Answer 17

功能版本的FizzBu​​zz

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

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

Answer 18

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

Answer 19

如果有人正在寻找其他解决方案：这个是纯，递归和可重复使用功能，可选可自定义参数值：

＆＃13;

＆＃13;

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*/);

＆＃13;

＆＃13;

＆＃13;

• from > till是打破递归的锚点。由于它会在from高于till之前返回 false ，因此会转到下一个语句（console.log）：
• Object.keys返回给定ruleMap中的对象属性数组，默认情况下为3和5。
  • 然后，它遍历数字并仅返回可被from整除的那些（0作为其余部分）。
  • 然后，它迭代过滤后的数字并根据规则输出说法。
  • 但是，如果filter方法返回一个空数组（[]，未找到任何结果），则只输出当前from值，因为join方法位于结尾最后只返回一个空字符串{""），这是一个falsy value。
• 由于console.log始终返回undefined，因此会转到下一个语句并再次调用自身，将from值递增1。

Answer 20

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

Answer 21

只想分享我解决这个问题的方法

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

Answer 22

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

Answer 23

实施略有不同。

您可以将自己的参数放入函数中。可以是非连续数字，如[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)
  })
}

Answer 24

看看这个！

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

Answer 25

多数民众赞成我是如何做到的：

不是最好的代码，但是这样做了

＆＃13;

＆＃13;

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

}

＆＃13;

＆＃13;

＆＃13;

Answer 26

另一种解决方案，避免过度分裂并消除＆＃34; Fizz＆＃34;和＆＃34; Buzz＆＃34;：

    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，但我认为（好吧，希望）我已经相当彻底了。）

＆＃34; Whaddya认为，先生？＆＃34;

Answer 27

不同的功能风格 - 天真

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，＆＃34; fizz＆＃34;]，[5，＆＃34; buzz＆＃34;]，...]

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