This issue I'm facing is directly related to JS scope, and despite my efforts in research, I have not been able to find effective solutions from similar stackoverflow queries.
Here is the program in question:
function write(x, y) {
console.log(x);
console.log(y);
}
var data = {
"property": {
"1": {
"values": [[1, 2], [3, 4], [5, 6], [7, 8], [9, 10]]
},
"2": {
"values": [[11, 12], [13, 14], [15, 16], [17, 18], [19, 20]]
}
}
}
var delay = 1000;
for (var x in data.property) {
for (var i = 0; i < data.property[x].values.length; i++) {
var one = data.property[x].values[i][0];
var two = data.property[x].values[i][1];
setTimeout(function() {
write(one, two);
}, delay);
delay += 1000;
}
}
This code snippet retrieves data from an object and iterates over both the object and its arrays. The goal is to display array values with a one-second gap between each, but it consistently shows only the values from the last iteration. Attempting to implement closures as suggested in other discussions has failed to resolve the issue.