Javascript WebSql 变量范围

Question

这个问题已经有答案了:

JavaScript closure inside loops – simple practical example (45 个回答)

已关闭 7 年前。

为什么我无法在事务中访问“i”变量？控制台.log(数据);输出数据成功。控制台.log(数据[i]);说未定义..

            for(var i = 0; i < data.length ; i++){
            db.transaction(function(tx){
                console.log(data);
                console.log(data[i]);
                tx.executeSql('SELECT * FROM REGISTERED_EVENTS where EVENT_ID = ?', [data[i].id], function(tx, results){
                   //do something
                }); 
            });
        }

Answer 1

Why i cant access 'i' variable in transaction?

可以，但它不会具有您期望的值。当循环完成时，事务回调将在稍后调用。该回调具有对变量 i 的持久引用，而不是创建回调时其值的副本，因此它会看到 i 与值data.length。因此，您会得到 data[i] 的 undefined。

对于这种情况，我通常使用构建器函数，以便回调在不更改的变量上关闭:

for (var i = 0; i < data.length; i++) {
    db.transaction(buildHandler(i));
}
function buildHandler(index) {
    return function(tx) {
        console.log(data);
        console.log(data[index]);
        tx.executeSql('SELECT * FROM REGISTERED_EVENTS where EVENT_ID = ?', [data[index].id], function(tx, results) {
            //do something
        });
    };
}

这是可行的，因为 buildHandler 创建的函数保留对 index 的引用，并且 index 永远不会改变。

或者，在那种特定情况下，您可以充分利用Array#forEach，因为它已经为您提供了一个获胜的变量(好吧，一个参数)不改变:

data.forEach(function(entry, index) {
    db.transaction(function(tx) {
        console.log(data);
        console.log(data[index]);
        tx.executeSql('SELECT * FROM REGISTERED_EVENTS where EVENT_ID = ?', [data[index].id], function(tx, results) {
            //do something
        });
    });
});