共通メソッド内の変数を個別のメソッドで使いたいです

質問させてください。
下のようなクラスを作っていまして、共通の処理を行うcommonメソッドに、それぞれ別のメソッドから個別の処理を渡し実行させたいと思っております。

javascript
1class Test {
2  // foo と bar 共通の処理
3  common(func) {
4    // 個別の処理を実行
5    func();
6  }
7
8  foo() {
9    // 共通メソッドに個別の処理を渡す
10    this.common(() => {
11      console.log('foo');
12    });
13  }
14
15  bar() {
16    // 共通メソッドに個別の処理を渡す
17    this.common(() => {
18      console.log('bar');
19    });
20  }
21}
22
23const test = new Test();
24test.foo();
25test.bar();

ただ console を表示させるだけのような簡単な処理でしたら上手くいったのですが、これを下のように共通処理の for 文の中でi使って実行すると、iが取れなくてエラーになってしまいます。

javascript
1class Test {
2  // foo と bar 共通の処理
3  common(func) {
4    for (let i = 0; i < 5; i++) {
5      // 個別の処理を実行
6      func();
7    }
8  }
9
10  // 個別の処理で i を使っていろいろやりたい
11  foo() {
12    // 共通メソッドに個別の処理を渡す
13    this.common(() => {
14      if (i === 2) {
15        console.log(`foo: ${i}`); // error
16      }
17    });
18  }
19
20  bar() {
21    // 共通メソッドに個別の処理を渡す
22    this.common(() => {
23      if (i === 4) {
24        console.log(`bar: ${i}`); // error
25      }
26    });
27  }
28}
29
30const test = new Test();
31test.foo();
32test.bar();

個別の関数の中でiを使っていろいろ処理行いたいのですが、上手い方法が分からず困っております。
もし良い解決方法をご存じの方がいらっしゃいましたら、ご教授いただけると助かります。
よろしくお願いいたします。

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

回答1件

ベストアンサー

こういうこと？

diff
1class Test {
2  // foo と bar 共通の処理
3  common(func) {
4    for (let i = 0; i < 5; i++) {
5      // 個別の処理を実行
6-     func();
7+     func(i);
8    }
9  }
10
11  // 個別の処理で i を使っていろいろやりたい
12  foo() {
13    // 共通メソッドに個別の処理を渡す
14-   this.common(() => {
15+   this.common((i) => {
16      if (i === 2) {
17        console.log(`foo: ${i}`); // error
18      }
19    });
20  }
21
22  bar() {
23    // 共通メソッドに個別の処理を渡す
24-   this.common(() => {
25+   this.common((i) => {
26      if (i === 4) {
27        console.log(`bar: ${i}`); // error
28      }
29    });
30  }
31}
32
33const test = new Test();
34test.foo();
35test.bar();
36
37// foo: 2
38// bar: 4