currentIndex = i; について解らない場所があったので質問させていただきました。

今回解らないのが、currentIndex = i; の i 数値はどうやって決まっているのかが解りません。

クリックされたときの流れは私の考えでは、setupDots() が読み込まれ、
button.addEventListener('click', () => { から下が、
ボタンがクリックされたときに動く。という考えで、
クリックされたときに動くのは理解できたのですが、

なぜクリックしたら、0 番めから 2 番目、2 番目から 0 番目のように移動できるのでしょうか？

他の回答者さんの回答のように、for で定義した i を currentIndex = i; に代入させ、
登録　(一番左は 0、真ん中は 2 番,,,と決めること。)
させているのでしょうか？

しかし、button.addEventListener('click', () => { は、クリックされてから
なので、もし登録されていて一つ一つ代入されているのならば、
どのタイミングで代入されているのでしょうか？
長文申し訳ありません。