Let me break down what's happening in this code before addressing your specific inquiries:
The variable db is assigned the return value of the openDatabase function. Following this, the code invokes db.transaction with a callback function as an argument. Within this callback function, supplied by db.transaction, the tx.executeSql method is called, passing another callback function. The results are then processed within this nested callback.
Now, onto your questions:
Initially, "db" is defined as a function (object) named "openDatabase" and invoked with certain parameters that the plugin recognizes.
No, in fact, the openDatabase function is being executed, and its return value is stored in the db variable. This returned value appears to be an object rather than a function.
"db," which is assumed to be a function (object) referred to as "openDatabase," contains a method called "transaction."
Absolutely, although it's worth noting that db may not necessarily be a function but simply an object.
The variable "db," now holding the reference to the openDatabase function...
This isn't accurate.
...includes a method called transaction alongside a self-invoking function as an argument...
It's essential to clarify that it isn't self-invoking.
...and this self-invoking function has the parameter "tx"? Where does "tx" originate from?
Since the callback function isn't self-invoking, the value of the tx parameter is provided by the caller when invoking the callback function. In this context, the transaction method will call the anonymous callback function and pass the value of tx to it. Similarly, the subsequent callback passed to executeSql will also receive values for tx and result.
Can I safely assume variables as parameters that aren't explicitly defined anywhere?
It's generally not recommended. Keep learning JavaScript to understand concepts like arguments, variables, etc. Check out some additional comments included below for better comprehension:
var db = openDatabase("DBTest", "1.0", "Sample Description", 200000);
// ^^---- variable
db.transaction(function(tx) {
// Argument ------------^^
tx.executeSql("SELECT * FROM Table1Test", [], function(tx, result) {
// Arguments ----------------------------------------------^^--^^^^^^
for (var i = 0, item = null; i < result.rows.length; i++) {
// Variables ----^------^^^^
item = result.rows.item(i);
document.getElementById('results').innerHTML +=
'<li><span>' +
item['text'] + '</span></li>';
}
});
});
The confusion seems to revolve around callbacks, let's examine a simpler illustration involving callbacks from both perspectives.
Assume we have a function called countUp that increments integer values between two specified numbers, calling our callback function at each step:
countUp(0, 5, function(value) {
console.log(value);
});
When utilized, the output would look like this:
countUp. It's actually the internal logic of countUp that triggers the callback. Here's a simulated representation of the countUp function:
function countUp(start, end, callback) {
// ^^^^^^^^---- the callback argument
var i;
for (i = start; i < end; ++i) {
// vvvvvvvv------- calls our callback
callback(i);
// ^----- supplying `value` during invocation
}
}
Live Example:
function countUp(start, end, callback) {
var i;
for (i = start; i < end; ++i) {
callback(i);
}
}
countUp(0, 5, function(value) {
snippet.log(value);
});
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>