💘

ドドスコやってみた

2022/08/10に公開

CSS

Zennの記事を徘徊していると面白そうな記事を発見しました。

元ネタ(？)はTwitterのようです。

これはぜひ参加したいと思い、私もやってみました。
JavaScriptで作りました。

出力結果

14292回...!!

ドドスコード

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ドドスコ</title>
</head>
<script>
    function dodosuko() {
        const ary = ["ドド","スコ"];
        const end = "ドドスコスコスコ";
        let aryDodosuko = [];
        let count = 0;
        while(true){
            console.log(ary[Math.floor(Math.random() * ary.length)]);
            if(aryDodosuko.length >=12){
                aryDodosuko.shift();
            }
            aryDodosuko.push(ary[Math.floor(Math.random() * ary.length)]);
            count++;
            if(aryDodosuko.join("") === end.repeat(3)){
                console.log(aryDodosuko.join(""))
                break;
            }
        }
        console.log("ラブ注入♡");
        console.log(count+"回");
        return;
}
</script>
<body>
    <div class="main">
        <input type="button" onClick="dodosuko()" value="ドドスコ" class="button">
    </div>
</body>
<style>
    .main {
        margin: 3rem auto;
        text-align: center;
    }
    .button {
        background-color: bisque;
        color: palevioletred;
        border-radius: 20px;
        border-color: white;
        width: 6rem;
    }
    .button:hover{
        background-color: palevioletred;
        color: black;
        border: 1px;
        border-color: black;
    }

</style>
</html>

気になったこと

配列の長さを12という上限に設定し、後ろに追加して前の値を削除していく方法ないのか気になりました。
調べたけど多分出来そうになかったので、12以上あったら前の要素は削除してからpushしました。

所感

楽しかったです。
ボタン作っただけなので苦手なCSSの練習もほんの少しだけできました。

出力結果

ドドスコード

気になったこと

所感

Discussion