Can someone tell me why function f1(foo)
and f2(arr)
in the following piece of code is not being executed inside the $(document).ready()?
$(document).ready(function() {
var main = function() {
var foo = //some text;
var bar = //some text;
var ARR = [];
function f1(foo) {
//matches foo with a reg exp and returns an array;
}
function f2(arr) {
//loops through arr and pushes each element into ARR;
}
var Rfoo = f1(foo);
var Rbar = f1(bar);
if(/* condition */) {
f2(Rfoo);
f2(Rbar);
}
var imgArr = [];
$('img[src *= "some-text"]').each(function() {
var a = //something;
var b = a.match(/* reg exp */)[0];
imgArr.push(b);
var formData = new FormData();
formData.append(/* something to do with an apikey */);
formData.append(/* something to do with b */);
$.ajax({
url: //something,
data: formData,
/*
...
*/
success: function(data, textStatus, jqXHR) {
var x = data["some-property"];
if(x !== null) {
$.each(x, function(index, value) {
var m = value["property-1"]; //basically it is some text
// and a few more initializations...
console.log(m); // THIS LINE IS WORKING
// THE FOLLOWING 4 LINES OF CODE IS NEVER EXECUTED. WHY IS IT SO?
// functions f1, f2 are declared outside $(document).ready() so shouldn't it work inside
// $(document).ready(). Am I doing something wrong here?
var Rbaz = f1(m);
if(Rbaz.length !== 0) {
f2(Rbaz);
}
})
}
},
error: function(err) {
//something;
}
});
});
return ARR;
}
var result = main();
console.log(result); // Showing an empty ARR...Why is it so?
});
I hope I have been able to make the problem appear clear to the reader. I'd like to know if I'm structuring the whole code in the right way. I'm open to hearing your suggestions, if any. Thanks!