どうも！LSSです！！
最近、迷路ばかりになってきている気がしますが、いじっててつい、いい感じのものができると公開したくなる病…^^;;;
↑自の周囲の◆をクリックしてみてください。そのまま迷路で遊べます^^
難易度について
ゴールに関しては、第三弾よりは難しく、第二弾よりは簡単、そんな感じです。
後述する新機能によって遊びやすくなっているのもあるかなと思います^^
今回の新機能！
既に歩いた道の色が変わる
これにより、未知のエリアか既に歩いたところかを判別しやすくなり、普通にゴールを目指すのも、よりディープな探索をするのもかなり遊びやすくなっているかと思います^^（自分は地下23階までいってみました！）
また、踏破済のマス数も左上に表示するようにしています。
利用済みの階段と未使用の階段
未使用の階段は、うっすらと黄色く光るようにしました。
道の色とあわせて、探索の助けになると思います！
マスの境目にあったグレーの線をなくしました
実はあれ、なぜ出てくるのか今まで分からなかったのですが、
「tdタグのstyleにborder-width:0px;」
を指定する事で消す事ができました^^
制作裏話
前回追加した「宝」もそうですが「取得済かそうでないか」「既に歩いた道かまだ歩いていない道か」を判定するのに、「配列変数に追加する」という方法をとっています。
配列変数の利用例
今回の例でいうと、初期化部分に
var ark=[];
で歩いた道を保存するための配列変数arkを宣言。
迷路描画時に
if(ark.indexOf(i+','+j+','+z)!=-1){txt+="#dddddd";}else{txt+="#eeeeee";};
で「配列変数arkに今から描画しようとしているマスが記録されているか否か」を判定して、結果を分けています。（iとjは描画時にxとyの代わりに使用している変数です）
歩く時にも「今まで踏み入った事がないマスに踏み入った時には、そのマスの位置をarkに追加」という事を、
if(ark.indexOf(x+','+y+','+z)==-1){ark.push(x+','+y+','+z);}
で行っています。
例えばこれから踏み込もうとしているマスが「地下3階 x:5 y:6」だった場合、
"5,6,3"
という文字列を生成して、配列変数arkに追加しています。
配列変数名.push(代入する内容);
が、配列変数への要素の追加。
配列変数名.indexOf(調べたい内容)
が「その配列変数の中に、調べたい内容は何番めに存在するか？」を返す記述ですが、まだ存在しなかった場合には-1を返します。
今回の使用例では「-1か否か」しか判定していません。
indexOf超便利！！
実際やってみるまで
「またループ文を書いて内容を精査する部分を作らないとかなー。
要素が増えたら重くなるだろうし、重くなりすぎるようなら没案になるし…」
と懸念していましたが、実際にはループしなくてもindexOfで一発で調査できました！^^
また、一発でできるといっても、JavaScriptの内部的には同様にチェックをかけているハズで、やはり重くなりすぎると…と心配していましたが…
試しに100万個のダミー要素をarkに追加しても普通の速度で描画されました！！
…1000万個にしたらさすがにもたつきましたが^^;;;
なお、このindexOfはKotlinにもあるようです^^
…てなとこで、今回はこのへんで！
次回もまた、よろしくお願いします^^
