【初学者実践録】ズンドコキヨシfeat天才日記

**こんにちは！ばーんです！**
[前回](https://qiita.com/baan_nasebanaru/items/cf145c1e58c97c74aab4)(fizzbuzz)に引き続き今回はズンドコキヨシを実践したいと思います。

前回と違うのはクリア経験がないということ…
前に数時間触れたのですが、fizzbuzzよりも難易度高いなって感じました。

そして今回はtwitterで見つけた天才日記の考えをお借りしています！
([@momokotoyopet](https://twitter.com/momokotoyopet)さん　ありがとうございます！)
自己肯定感を高めることで、どれぐらい効果あるのかなーということでお試しです。

それではいってみましょー！！

※対象の方や、取り組み方については[前回の記事](https://qiita.com/baan_nasebanaru/items/cf145c1e58c97c74aab4)をご確認お願いします

#はじめに

（追記）まとまりがなくて長い文章になってしまいました…続きを読む方はその辺りご了承下さい

【ルール】
>「ズン」「ドコ」のいずれかをランダムで出力し続けて「ズン」「ズン」「ズン」「ズン」「ドコ」の配列が出たら「キ・ヨ・シ！」って出力した後終了って関数作ったら満点で単位貰ってた

ここから考えたポイントは、
##①要素が2つの配列を準備し、ランダムに出力する
###①-1:要素が2つというのがふんわりしてる。連想配列？配列の種類を確かめる
###①-2：とりあえずは配列の中身をランダムに出力する。n回ループさせる関数が必要
##②直近5回の出力結果が特定の場合は、ループを終わらせる処理をする
###②-1：出力結果を戻り値として、格納する場所が必要。場所っていう言い方も怪しい気はする
###②-2：おそらくif文で判定してtrueで「キヨシ！」を出力する

であってると思います。天才かも。いざ参ります。

###①-1:要素が2つというのがふんわりしてる。連想配列？配列の種類を確かめる
そもそも配列のことがふんわりとしか理解できてないので、調べます「JS　配列」と…
あったあった、[良いサイト](https://www.sejuku.net/blog/31746)。
ここを元に「ずん」「どこ」を配列を使い出力できるようにします。こちら↓

```js
const zundoko = ["ずん" , "どこ"];
console.log(zundoko[1]);
```
これで数字が0ならずん。1ならどこですね。

###①-2：とりあえずは配列の中身をランダムに出力する。n回ループさせる関数が必要
ランダムに出力から取り掛かりましょう！「JS　ランダム」で検索と…[ここ](https://www.sejuku.net/blog/22432)よく見るな…

```js
const zundoko = ["ずん" , "どこ"];
var random = Math.floor( Math.random() * 2 );
console.log(zundoko[random]);
// var random = Math.floor( Math.random() * 2 );
// console.log( random );
```
戦いの歴史もコメントアウトしてますw
まずはランダムに整数をconsole.logさせて、あとは引数として渡せばいけるはず…
で、変数宣言が最初下にあってうまくいかなかったので、移動させたらOKでしたね！

そして、n回ループさせます（無駄なコメントは順次消してます）。

```js
for ( var i = 1 ; i < 10 ; i++ ) {
const zundoko = ["ずん" , "どこ"];
var random = Math.floor( Math.random() * 2 );
console.log(zundoko[random]);
}
```
ぱっと思いついたのがfor文。これで9回ランダムに出るはず…よし、でましたね。天才なのでは…

###②-1：出力結果を戻り値として、格納する場所が必要。場所っていう言い方も怪しい気はする
場所というより、格納する配列が必要なんだよね…？多分。

んーここがめっちゃむずい。躓く…
とりあえず、
####直近5回の出力を出すようにする。
####forの条件を↑が「ずんずんずんずんどこ」にする
でいけるか…？

ちょっと待って。そもそもこれfor文でいけるの？という疑問で条件をi<10からi==10に変更。

```js
for ( var i = 1 ; i == 10 ; i++ ) {
var random = Math.floor( Math.random() * 2 );
console.log(zundoko[random]);
}
```
あかんやんこれ。ということでアプローチ変えます。
###答えを出すところ、チェックするところ
で躓いてるから、反対の答えがあってたとして　のアプローチを試みます。

```js
if (1 == 1){
  console.log("ok")
  } else {
    console.log("ng")
  }
```
はい。まずはエラーで荒んだ心を癒すために超簡単なif文。
あー潤った。天才（ちょっと使うの忘れてた）。

じゃあこのifのが文字列なら？変数なら？戻り値なら？を段階的に試します
文字列はまぁOKでした。関数の実行結果がちょっと躓きましたが…

```js
const multiplication = (x , y) => {
  return x ** y ;
}
console.log(multiplication(2,2));

if (multiplication(2,2) == 4){
  console.log("ok")
  } else {
    console.log("ng")
  }
```
先日作った超簡単なコード応用で試せました。天才
これをずん、どこに置き換えてみます。

```js
const multiplication = (zun , doko) => {
  return zun || doko ;
}
console.log(multiplication("ずん","どこ"));

if (multiplication("ずん","どこ") == "ずん"){
  console.log("ok")
  } else {
    console.log("ng")
  }
```
なんか　|| が思った挙動してないけど、とりあえずOK。ここでランダム要素を入れればいいので…どん！

あかん。躓く…まずはランダムに「ずん」「どこ」を出力する関数を作って、それを変数宣言して＝＝すればいいはずっ！

```js
const calculator = (random) => {
  return random;
}
const zundoko = ["ずん" , "どこ"];
var random = Math.floor( Math.random() * 2 );
var randomZundoko = calculator(zundoko[random]);
console.log(randomZundoko);

if (randomZundoko == "ずん"){
  console.log("ok");
  } else {
    console.log("ng");
  };
```

いけたー！！！天才やでこれ！（達成感MAX）
いまのところ「ずん」or「どこ」をランダムに出力して「ずん」ならOKというコードができました。

いったん頭をリセットします。残るは、
###①5回出力する
###②①が「ずんずんずんずんどこ」なら「きよし」を出力させる
###③成功するまでループ！

で、いけるはず。

####①5回出力する
これでいけるはず！（死ぬほど試行錯誤した！天才←）

```js
const calculator = (random) => {
return random;
}

for(var i = 1; i < 6 ; i++){
const zundoko = ["ずん" , "どこ"];
var random = Math.floor( Math.random() * 2 );
var randomZundoko = calculator (zundoko[random]);
console.log(randomZundoko);
};
```
よし。これで「ずん」と「どこ」が5回ランダムに出力される
しかし、判定するのって「ずんずんずんずんどこ」だから＋しないといけないんじゃない？あれ天才？
と思って書き換えると…
<img width="559" alt="Screen Shot 2020-02-01 at 19.06.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/534071/480fbde3-d375-3827-2021-74e4d34ec2bf.png">
なるほどね。for文だとn回処理を行うからランダムに出るけど、これだと固定の値が6回出るのね…何回これやるんだ俺…

ということは、元に戻してミッション追加
###①5回出力する（済）後にn回に変更予定
###②出力した直近5回の値を格納する配列が必要。戻り値？（New!）
※成功するまでループ！
###③②が「ずんずんずんずんどこ」なら「きよし」を出力させる


（なんか同じことずっとやってる気がするけど…気のせいか…）
###②出力した直近5回の値を格納する配列が必要。戻り値？（New!）
戻り値？配列に格納？知識があやふやなので再確認。
[ここのサイト](https://www.javadrive.jp/javascript/function/index2.html)がすごい分かりやすかったです！感謝！
なるほど、処理を関数にするとスコープ内の変数も持ち出せるのね…

ということはこうだ！だんっ！
<img width="559" alt="Screen Shot 2020-02-01 at 19.53.09.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/534071/6ebeea9d-8ff5-0324-e791-f95d3328d3c2.png">
わぁ！どんな処理でもきよし！って言ってる！天才！（）
奇跡的に「ずん、ずん、ずん、ずん、どこ」も出力されてる。関係ないけど。

もう少しだと思うのですが…
初心に帰って配列のあれこれを確認します。見てる感じ、forEach,push,lengthあたりを使いそうなんだよなぁ…
forEach　配列中身を出すものなので多分違う。そもそも配列に入れれてない。
push　配列に要素を追加なので、これであってる気がするんですが…

##ここにきて
まとまりがなくてすいません…
じつはこの辺りで2h近く使ってました。そして、ようやく引数の意味を理解しました…（長かった）
今回学んだことは次回にまとめるので、その辺りは割愛します。
時間をかけて引数を学び配列への格納が理解できたのですが？

**あれ？ifって配列の比較できないんじゃない？**

と思い試してみると…やっぱり＾＾できない！！！
こんなことに気付くなんて天才なのでは…

確か、配列を比較するメソッドあったよなぁ…？
あれ？でもそもそも＋して文字列にしちゃえば…

と2通り思いついたのですが、今回は後者の方法（if）でチャレンジしていきます！

###まずはランダムに出力した文字をひっつける
ここも結構苦労しました。for使ったりいろいろスマートにしようとしたのですが、**同じ文字列が出てきてしまう**という状態を脱せませんでした(あれ？これ何回目…？)。
これは恐らく最初に出力した文字が繰り返されている為。なので文字列を分けて出さないといけないのですが…
仕方ない。見栄え気にしても進まないので泥臭い方法で出します。えぃっ！

```js
const calculator = (random) => {
    return random;
    };

const zundoko = ["ずん" , "どこ"];
var random1 = Math.floor( Math.random() * 2 );
var randomZundoko1 = calculator (zundoko[random1]);

var random2 = Math.floor( Math.random() * 2 );
var randomZundoko2 = calculator (zundoko[random2]);

var random3 = Math.floor( Math.random() * 2 );
var randomZundoko3 = calculator (zundoko[random3]);

var random4 = Math.floor( Math.random() * 2 );
var randomZundoko4 = calculator (zundoko[random4]);

var random5 = Math.floor( Math.random() * 2 );
var randomZundoko5 = calculator (zundoko[random5]);

var containerZundoko = (answerCheck) =>{
    console.log(answerCheck);
    if (answerCheck == "ずんずんずんずんどこ"){
        console.log("きよし！");
    };
};

containerZundoko(randomZundoko1+randomZundoko2+randomZundoko3+randomZundoko4+randomZundoko5);
```
おし！これで「ずん」or「どこ」が5個でて1つの文字列にする。その文字列が条件に合っていればtureを返す！というコードは書けました。天才なのでは…

###ループで回して特定条件で止める
はい。先に言うとこの最後の2つで死ぬほど時間取られました…
for,while,do while をいろいろ試します…無限処理はできるのですが、breakがうまくいきません。

ここであってるだろ！というところに置けばエラーがでます。
エラーが出ないとこに置くと1回で止まります。

何がうまく行ってないのか？を冷静に考えると、出力された文字列がうまくbreak付きのif文に渡せていないことだな…と理解しました。
スコープの関係で外に持ち出すのが難しく…と四苦八苦していたらできました！（内容端折ってすいません）

```js
const calculator = (random) => {
    return random;
    };

for( ;; ){
const zundoko = ["ずん" , "どこ"];
var random1 = Math.floor( Math.random() * 2 );
var randomZundoko1 = calculator (zundoko[random1]);

var random2 = Math.floor( Math.random() * 2 );
var randomZundoko2 = calculator (zundoko[random2]);

var random3 = Math.floor( Math.random() * 2 );
var randomZundoko3 = calculator (zundoko[random3]);

var random4 = Math.floor( Math.random() * 2 );
var randomZundoko4 = calculator (zundoko[random4]);

var random5 = Math.floor( Math.random() * 2 );
var randomZundoko5 = calculator (zundoko[random5]);

var containerZundoko = (answerCheck) =>{
    console.log(answerCheck);
    if (answerCheck == "ずんずんずんずんどこ"){
        console.log("きよし！");
    };
};

containerZundoko(randomZundoko1+randomZundoko2+randomZundoko3+randomZundoko4+randomZundoko5);

if(randomZundoko1+randomZundoko2+randomZundoko3+randomZundoko4+randomZundoko5 == "ずんずんずんずんどこ"){
    break;
};
};
```
こちらが今回の最終形です。天才なのでは…

##さいごに
こんなまとまりのない、長い文章を読んでいただき誠にありがとうございましたm_ _m
本当は答え合わせまで載せたかったのですが、長くなったので次回に回します。
また、引数、戻り値など初学者が躓きそうなポイントも次回一緒に記載するので、よろしければ見て下さい＾＾

To　ずんどこぐらい楽勝や　という皆様へ
恐らく突っ込みどころ多いと思うので、気になることがあればコメント頂ければ幸いです。
一応補足ですが、「天才」の記述は自己肯定感を高めて意欲を高くするものなので、その辺りの表現についてはご理解下さい

To　初学者の皆様へ
自分もProgateを終えてすぐのレベルですが、なんとかfizzbuzzもずんどこゲームもクリアできました。
学習だけではいまいち把握できない要素が詰まったゲームなので、まだの方は是非！
2日以内に解ければ間違いなく天才です＾＾自分を褒めていいと思います＾＾（僕も自分を大絶賛してます）