【JavaScript】配列の数だけカウントアップしたい

問題：クリックした回数だけ、コンソールログでカウントアップして、配列の個数クリックしたら、カウントアップをやめたいです。
エラー：Whileでループして、breakで抜けれるとおもったのですが、今度はカウントがうまくいかなくなってしまいました。ご教授お願いいたします。

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://code.jquery.com/jquery-3.5.0.js" integrity="sha256-r/AaFHrszJtwpe+tHyNi/XCfMxYpbsRg2Uqn0x3s2zc=" crossorigin="anonymous"></script> </head> <body> <button class="btn">click</button> <script> const array=['aa','bb','cc'];

    let i=0;
    $('.btn').on('click',function(){
    while(i<array.length){
        i++;
        if(i==array.length){
            break;
        }
        console.log(i);
    }
 
});
</script>

</body> </html>

行動規範の内容に同意します

回答1件

ベストアンサー

$(".btn").on("click",{a:[1,2,3],i:0},function(event){if(event.data.i<event.data.a.length-1)console.log(++event.data.i)});

Re: hitobaba さん

投稿2020/05/07 09:35

think49

総合スコア18166

hitobaba

2020/05/07 10:01

早速の返答ありがとうございました！大変助かります！もし、お応えしていただけるとうれしいのですが、わたしは初心者過ぎて、on('click',function(){としかしらず、このように{a:[1,2,3],i:0}のように変数や配列をfunctionの前で書くことで、function内で利用するっていうイメージでしょうか？初めて目にして、ちょっと自信がなく…。