← 記事に戻る
# パスコードをランダムで生成するコードです。JavaScriptで書いてみました。

今日は朝から蒸し暑さを感じます。あの一週間も続いた雨はどこに行ってしまったのでしょうか?東京では立て続けに悲惨な事件が起きています、報道することにより模倣犯を増やしているような気がします。

さて、今日はパスコード(パスワード)をランダムで生成するコードをJavaScriptで書いてみました。パスコードの強度はそれ程、高くないかもしれませんが一応、パスコードを生成する事が出来ます。ソースコードを書いていてうっかりミスをしてしまいまして、無限ループを発生させてバグ取りに5分ぐらい費やしました。ループした原因は違う変数を判断文で使っていたという初歩的なミスです。この頃はそういうミスは稀ですが・・・その結果、無限ループに陥っていました。

パスコードというものを作ってみて案外簡単に作れるものだと実感。これを作る前に[パスコードメーカー](https://www.youtube.com/watch?v=Mh8ZnnKn9Bc)を作成するという動画を見ました。githubにソースコードも記載していましたので考え方は参考にしましたがコードは違うと思います。たにぐちさんの動画はvue.jsを使用してパスコードを作っているのに対して、自分はネイティブjsでパスコードを生成しているという違いがあります。

<https://zip358.com/tool/PassCode/>

[![YouTube Video](https://img.youtube.com/vi/FbHN6jDfil8/0.jpg)](https://www.youtube.com/watch?v=FbHN6jDfil8) 

```
document.getElementById("btn1").addEventListener("click", () => {
    const mode = {
        mode0: !document.getElementById("mode0").value ? 8 : document.getElementById("mode0").value,
        mode1: document.getElementById("mode1").checked ? true : false,
        mode2: document.getElementById("mode2").checked ? true : false,
        mode3: document.getElementById("mode3").checked ? true : false,
        mode4: document.getElementById("mode4").checked ? true : false
    };
    const data = {
        txt_cnt: mode.mode0,
        txt1: mode.mode1 ? "0123456789" : "",
        txt2: mode.mode2 ? "ABCDEFGHIJKLMNOPQRSTUVWXYZ" : "",
        txt3: mode.mode3 ? "abcdefghijklmnopqrstuvwxyz" : "",
        txt4: mode.mode4 ? "#$&*@+-" : "",
    };


    // console.log(mode,data);

    let str = "";

    if (mode.mode1 || mode.mode2 || mode.mode3 || mode.mode4) {
        let txt_str = data.txt1 + data.txt2 + data.txt3 + data.txt4;
        do {
            str = "";
            for (let i = 1; i <= data.txt_cnt; i++) {
                str = str + txt_str.substr((getRandomInt(txt_str.length) - 1), 1);
            }
        } while ((() => {
            let flg = [];
            flg[0] = mode.mode1 ? /[0-9]/.test(str) : true;
            flg[1] = mode.mode2 ? /[A-Z]/.test(str) : true;
            flg[2] = mode.mode3 ? /[a-z]/.test(str) : true;
            flg[3] = mode.mode4 ? /[#|$|&|*|@|+|\-]/.test(str) : true;
            
            return (() => {
                let f = true;
                for (const key in flg) {
                    if (!flg[key]) {
                        f = false;
                    }
                }
                return f;
            })();
            return false;
        })() === false);
        document.getElementById("view").value = str;
    } else {
        alert("どれかを選択してください");
    }

});
function getRandomInt(max) {
    return Math.floor(Math.random() * max);
}
```



 [ ![](https://zip358.com/wp-content/uploads/2026/01/image-25-300x300.png) 広告と収入と狭間.

 ](https://zip358.com/2026/01/27/%e5%ba%83%e5%91%8a%e3%81%a8%e5%8f%8e%e5%85%a5%e3%81%a8%e7%8b%ad%e9%96%93.html) 

 [ ![](https://zip358.com/wp-content/uploads/2026/01/image-24-scaled.png) 年齢とか技術とか見た目とかさ.

 ](https://zip358.com/2026/01/26/%e5%b9%b4%e9%bd%a2%e3%81%a8%e3%81%8b%e6%8a%80%e8%a1%93%e3%81%a8%e3%81%8b%e8%a6%8b%e3%81%9f%e7%9b%ae%e3%81%a8%e3%81%8b%e3%81%95.html) 

 [ ![](https://zip358.com/wp-content/uploads/2026/01/image-23.png) OSS:オープンソースソフトウェア

 ](https://zip358.com/2026/01/25/oss%ef%bc%9a%e3%82%aa%e3%83%bc%e3%83%97%e3%83%b3%e3%82%bd%e3%83%bc%e3%82%b9%e3%82%bd%e3%83%95%e3%83%88%e3%82%a6%e3%82%a7%e3%82%a2.html) 

 [ ![](https://zip358.com/wp-content/uploads/2026/01/image-21.png) お笑い芸人は貴方より

 ](https://zip358.com/2026/01/24/%e3%81%8a%e7%ac%91%e3%81%84%e8%8a%b8%e4%ba%ba%e3%81%af%e8%b2%b4%e6%96%b9%e3%82%88%e3%82%8a.html) 

 [ ![](https://zip358.com/wp-content/uploads/2026/01/G_FRW6fWwAAlplE-scaled.jpeg) ドラマ:冬と春のアレ

 ](https://zip358.com/2026/01/23/%e3%83%89%e3%83%a9%e3%83%9e%ef%bc%9a%e5%86%ac%e3%81%a8%e6%98%a5%e3%81%ae%e3%82%a2%e3%83%ac.html)