使用IIFE时避免在循环中定义函数

Question

I have the following following code:

for (i = 0; i < 5; i++) {
    this.hands[0].cards[i].img.on('mousedown', (function (i) {
        var j = i;
        return function (event) {
            self.hands[0].cards[j].holdCard();
        };
    })(i));
}

This is working fine for my needs but JSHint is complaining:

[L1164:C10] W083: Don't make functions within a loop.

How can I keep JSHint happy by rewriting this differently?

Answer 1

You can replace the IIFE with a separate function outside the loop:

function createHandler(j, self) {
    return function (event) {
        self.hands[0].cards[j].holdCard();
    };
}
for (i = 0; i < 5; i++) {
    this.hands[0].cards[i].img.on('mousedown', createHandler(i, this));
}

Useful reference: JSLint Errors Explanation (thanks to user1671639 for the link).