web-dev-qa-db-ja.com

JavascriptのFizzBu​​zzプログラム（詳細を記載）

誰かが私のこのコードをFizzBu​​zzに修正してくれませんか？小さな間違いがあるようです。以下のこのコードは、3または5で割り切れない数値のみを出力するのではなく、すべての数値を出力します。

1から100までの数値を出力するプログラムを作成します。ただし、3の倍数の場合は、数値の代わりに"Fizz"を出力し、5の倍数の場合は、"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")
  }
}
javascriptfizzbuzz
8
pacmanfordinner
/*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/

7
Ben McCormick
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);
}
58
Trevor Dixon

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が巧妙に行ったことは、言語の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がfalseの場合、反復値（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で除算するかどうかを確認します（上記の1つは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で使用するための気の利いたヒントをいくつか見つけていただければ幸いです:)

7
Noctis

三項演算子を使用すると、非常に簡単です。

    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);
    }
3
Pavan Varanasi
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)
  }
}
2
Kaneiba

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 57以降に進むことができると思います。例えば：

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);
}
1
Matt Murphy
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への最も簡単な方法の1つ。 3と5の倍数は、同時に15の倍数を意味します。

2番目のバージョン：

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);    
}
1
Mahmut G

あなたのby3およびby5関数の場合、該当する場合は暗黙的にundefinedを返し、該当しない場合はfalseを返しますが、ifステートメントはtrueを返すかのようにテストしています。またはfalse。 trueステートメントがそれを取得するように、該当する場合は明示的にifを返します。

1
icktoofay

これは私が書いたものです：

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

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

誰かが他の解決策を探している場合：これはpure、recursive、およびreusable関数とオプションでcustomizableパラメーター値：

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は、再帰を中断するためのアンカーです。 fromがtillより高くなるまでfalseを返すため、次のステートメント（console.log）に進みます。
  • Object.keys は、指定されたruleMap内のオブジェクトプロパティの配列を返します。この場合、デフォルトでは3と5です。
    • 次に、数値を繰り返し処理し、from（残りは0）で割り切れる数値のみを返します。
    • 次に、フィルタリングされた数値を反復処理し、ルールに従ってことわざを出力します。
    • ただし、filterメソッドが空の配列を返した場合（[]、結果が見つかりません）、最後の from メソッドは最終的に空の文字列のみを返すため、現在のjoin値のみを出力します。 （""）これは 偽の値 です。
  • console.logは常にundefinedを返すため、次のステートメントに進み、fromの値を1ずつインクリメントして再度呼び出します。
1
Boghyon Hoffmann

別の解決策は、余分な分割を避け、「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ですが、（わかりました、希望）私はかなり徹底してきました。）

「ワッディアは思いますか？」

0
Mike Vokits

機能的なスタイル！ 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);
0
Josue Alexander Ibarra

わずかに異なる実装。

独自の引数を関数に入れることができます。 [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)
  })
}
0
wle8300

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

参照： MaciejPirógによるドメイン固有言語の埋め込みによるHaskellのFizzBu​​zz

0
QuentinUK

これを解決する私の方法を共有したいだけです

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);
  }
}
0
Andrew Losseff
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();
0
Prasenjit Mahato
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);
}
0
user3998577

これをチェックしてください！

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();
0
bekzat
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);
0
Karthik Samyak

それは私がそれをした方法です：

最高のコードではありませんが、それでうまくいきました

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

}
0
Mohdule

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