質問: まずは下記のような簡単な関数があります。 カウントをクリックするたびにnumの数値が増えていきます。 ``` カウント ``` 要件を増やして、下記のように1ページに複数のカウンタを用意する時 ``` カウント カウント ``` それぞれのカウント用に自動でnum(カウンター)を用意するにはどのような方法がありますでしょうか? 初歩的な質問で恐縮ですがご教示願います。
回答: こんにちは。 > > それぞれのカウント用に自動でnum(カウンター)を用意するにはどのような方法がありますでしょうか? > > > の回答としては、クロージャ(closure)を使うことが思いつきます。 以下、その実装例です。 ``` function cnt(name) { var num = 0; return function() { num ++; console.log(`${name} num: ${num}`); } } $("button").each(function(i) { $(this).on("click", cnt(`button#${i}`)); }); ``` 上記のコードを動作確認できるよう、以下にも上げておきましたので、お試しください。 上下それぞれのボタンをクリックしていくと、以下の画面: !イメージ説明 の Console に表示されているとおり、個別に `num` がカウントアップされていくことを確認できると思います。 参考になりましたら幸いです。