Javascript | Do after For Loop - javascript

I would like to call a function after a for loop action finish, any orientation please ?
This is my code :
Function1: function () {
var $this = this;
$this.Action();
var l = $this.list.length;
for (var i = 0; i < l; i++) {
Function2(i)
}
function Function2(i){
axios.post('/api', $this.list[i])
.catch(function(error) {
console.log(error);
});
};
},
I would like ot call $this.notAction() when i > l || i == l

Use async/await
Function1: async function () {
var $this = this;
$this.Action();
var l = $this.list.length;
for (var i = 0; i < l; i++) {
await Function2(i)
}
$this.notAction();
async function Function2(i){
try {
await axios.post('/api', $this.list[i]);
} catch (err) {
console.log(err);
}
};
}

Just check when the last call was executed, since i will never be greater than l. Also use the normal functions in a POST call with jQuery.
Function1: function () {
var $this = this;
$this.Action();
var l = $this.list.length;
for (var i = 0; i < l; i++) {
var p = Function2(i);
p.done( function() {
if ( i == ( l - 1 ) ) {
$this.notAction();
}
});
}
function Function2(i){
return axios.post('/api', $this.list[i])
.catch(function(error) {
console.log(error);
});
};
},

Something like this would work..
for (var i = 0; i <= l; i++) {
if(i==l){
$this.notAction();
break;
}
Function2(i);
}

Related

$.when apply for single request

I am trying to use $.when apply in my code. However, it seems that the format return is different for single and multiple request. How can i cater for it?? I am trying not to have another if else outside of it.
$.when.apply(null, apiRequestList).then(function () {
for (var i = 0; i < arguments.length; i++) {
var value = arguments[0];
}
});
This is what i do not want to do.
if (apiRequestList.length === 1) {
$.ajax({
});
} else {
$.when.apply(null, apiRequestList).then(function () {
for (var i = 0; i < arguments.length; i++) {
var value = arguments[0];
}
});
}
You can simply convert arguments into an array, when the length of apiRequestList is 1:
$.when.apply(null, apiRequestList).then(function() {
var _arguments = Array.prototype.slice.call(arguments);
if (Array.isArray(apiRequestList) && apiRequestList.length === 1)
_arguments = [arguments];
for (var i = 0; i < _arguments.length; i++) {
var value = _arguments[i][0];
console.log(value);
}
});
Live Example on jsFiddle (since we can't do ajax on Stack Snippets):
function x(a) {
return $.post("/echo/html/", {
html: "a = " + a,
delay: Math.random()
});
}
function doIt(apiRequestList) {
$.when.apply(null, apiRequestList).then(function() {
var _arguments = arguments;
if (Array.isArray(apiRequestList) && apiRequestList.length === 1)
_arguments = [arguments];
for (var i = 0; i < _arguments.length; i++) {
var value = _arguments[i][0];
console.log(value);
}
console.log("----");
});
}
doIt([x(1), x(2), x(3)]);
doIt([x(4)]);
Example output (it'll vary because of the Math.random()):
a = 4
----
a = 1
a = 2
a = 3
----

Returning links inside multiple-levels iframe using a function in CasperJS

I am trying to get all links under multiple level iframes in CasperJS. There was a solution to resolve the case that there is one-level iframe. I am trying to put getLinksFromIFrame inside the getLinksFromIfram to do recurive traverse but failed.
For this code, how should I do it for multiple-level iframes?
function getLinksFromIframes( callback ) {
var links = [];
var iframes = this.evaluate( function() {
var iframes = [];
[].forEach.call(document.querySelectorAll("iframe"), function(iframe, i) { iframes.push( i ); });
return iframes;
});
iframes.forEach( function( index ) {
this.withFrame(index, function() {
links = links.concat( this.getElementsAttribute( 'a', 'href' ) );
console.log("works: " + links);
});
}, this);
this.then(function(){
callback.call(this, links);
});
}
casper.start(url, function () {
getLinksFromIframes.call(this, function(links){
thelinks = links;
console.log("Links: " + thelinks);
});
})
.then(function(){
console.log("Links later: " + thelinks);
})
.run();
Maybe like this:
var casper = require("casper").create({
// verbose: true,
// logLevel: "debug",
webSecurityEnabled : false
});
//page.onConsoleMessage = function(msg) {console.log(msg);};
casper.on('remote.message', function (message) {
this.echo(message);
});
casper.start("http://domu-test-2/node/1", function () {
this.evaluate(function () {
var i,
x = document.querySelector("iframe#test") //First iframe
.contentDocument.querySelector("iframe#test2") //Second iframe in the first
.contentDocument.querySelectorAll("a"); //Links
for (i = 0; i < x.length; i++) {
console.log(x[i].href)
}
})
}).wait(1000).run();
It was hard, but i've created this script:
var casper = require("casper").create({
// verbose: true,
// logLevel: "debug",
webSecurityEnabled : false
});
var links = [];
function get_links(obj) {
return obj.evaluate(function () {
var i,
l = document.querySelectorAll("a"),
l2 = [];
for (i = 0; i < l.length; i++) {
l2[i] = l[i].href;
}
return l2
});
}
function unique(arr) {
var obj = {};
for (var i = 0; i < arr.length; i++) {
if (/http(.*)?/.test(arr[i])) {
var str = arr[i];
obj[str] = true;
}
}
return Object.keys(obj);
}
function getLinksFromIframes(callback) {
this.echo("Here we come: " + this.getCurrentUrl() + "\n");
function to_frame(obj) {
var iframes = to_evaluate(obj);
iframes.forEach(function (index) {
this.withFrame(index, function () {
this.echo("We are here: " + this.getCurrentUrl());
var l = unique(get_links(this));
var i;
for (i = 0; i < l.length; i++) {
console.log(l[i]);
links.push(l[i])
}
links = unique(links);
console.log("");
to_frame(this) //multi lvl
}); //The first iframe
}, obj);
}
function to_evaluate(obj) {
return obj.evaluate(function () {
var iframes = [];
[].forEach.call(document.querySelectorAll("iframe"), function (iframe, i) {
iframes.push(i);
});
return iframes;
})
}
to_frame(this);
this.then(function () {
callback.call(this);
});
}
casper.start("http://domu-test-2/node/1", function () {
getLinksFromIframes.call(this, function () {
console.log("Done!\n");
var i;
for (i = 0; i < links.length; i++) {
console.log(links[i]);
}
});
}).then(function () {}).run();
Note:
Now we have a full multi lvl.
./casperjs test.js >>/dev/stdout
Here we come: http://domu-test-2/node/1
We are here: http://domu-test-2/node/2
http://link_1_inside_iframe(1.1)_from_main_frame
We are here: http://domu-test-2/node/3
http://link_1_inside_iframe(2.1)_from_1.1
We are here: http://domu-test-2/node/5
http://link_1_inside_iframe(2.2)_from_1.1
We are here: http://domu-test-2/node/4
http://link_1_inside_iframe(1.2)_from_main_frame
We are here: http://domu-test-2/node/6
http://link_1_inside_iframe(2.1)_from_1.2

How to use function outside $scope ( error: function isn't defined)

I have a rzslider which takes in true or false for disabled. I want disable to be true based on a function. So I want to make it disabled:$scope.truthy
I have a function called checkDupsName() checkDupsName should return true if there is a duplicate, false otherwise. I set my $scope.truthy variable to be true if the function returns true but the issue is, when I call it outside this function ( in my slider), it's ALWAYS false.
$scope.checkDupsName = function(Mylist) {
var i, j, n;
n = Mylist.length;
for (i = 0; i < n; i++) {
for (j = i + 1; j < n; j++) {
if (Mylist[i] === Mylist[j]) {
return true;
}
}
}
return false;
};
$scope.truthy=false;
$scope.nameList = [];
var Types = [];
$scope.loadRuleList = function() {
PrioritizeService.getData($scope.prioritizeURL).
then(function(response) {
if (response) {
Types = response;
}
for (var k = 0; k < Types.length; k++) {
$scope.nameList.push(Types[k].name);
}
if($scope.checkDupsName($scope.nameList)) {
$scope.truthy=true;
}
};
$scope.slider = {
value: 1,
options: {
floor: 0,
ceil: 3,
showTicks: true,
showTicksValues: true,
disabled:$scope.truthy
}
};
You are defining it inside of your function that is being called by then. You should move it outside and make it a function defined/declared on the scope instead and have it take the data it uses as a parameter.
// initialize it so your code does not blow up in the case of forgotten undefined or null check
$scope.nameList = [];
$scope.loadRuleList = function() {
var me = this;
PrioritizeService.getData($scope.MyURL).
then(function(response) {
if (response) {
Types = response;
}
// re-init the nameList field
me.nameList = [];
for (var k = 0; k < Types.length; k++) {
me.nameList.push(Types[k].name)
}
//check for duplicates
var areDups = me.checkDupsName(me.nameList);
}
}
$scope.checkDupsName = function(listToCheck) {
var i, j, n;
n = listToCheck.length;
for (i = 0; i < n; i++) {
for (j = i + 1; j < n; j++) {
if (listToCheck[i] === listToCheck[j]) {
return true;
}
}
}
return false;
}

How to print the items in q, the async way

Here is a program i'm trying wrap my head around with, how do i print the items in the q properly, once all the results are pushed ?
function asyncAdd(a,b,callback) {
setTimeout(function() {
return callback(a+b);
},0);
}
var q = [];
var ctr = 0;
for (var i=0; i<9; i++) {
(function(i) {
var res = asyncAdd(i, 0, printRes);
q.push(res);
})(i);
}
function done(q) {
console.log("done"+q);
}
function printRes(res) {
return res;
}
Please have a look at my version
function asyncAdd(a,b,callback) {
callback(a+b);
}
var q = [];
var ctr = 0;
var max = 9;
for (var i = 0; i < max; i++) {
asyncAdd(i, 0, printRes);
}
function done(q) {
console.log("done " + q);
}
function printRes(res) {
q.push(res);
if (q.length === max)
done(q);
}

AngularJS multiple $http calls, with multiple results

I have a LIST of Id's and I want all of them to contact my API.
The way I did it is like this:
var someFunct = function() {
for (var i = 0; i < Apples.length; i++) {
var Apple = Apples[i];
$http.get("APIUrl" + Apple.Id).
success(function (response) {
for (var i = 0; i < response.Appleseeds.length; i++) {
if(Apple.Appleseeds.Id == response.Appleseeds.Id)
{
Apple.Size = response.Appleseeds.Size;
}
}
})
}
So the problem is that Apple[2] has changed value, where Apple[0] and Apple[1] stay untouched. response.Appleseeds have their own list of Id's. So I need to change the Size of ALL THE APPLES not just Apple[2].
You're close, use a closure instead:
var someFunct = function () {
for (var i = 0; i < Apples.length; i++) {
(function (Apple) {
$http.get("APIUrl" + Apple.Id)
.success(function (response) {
for (var i = 0; i < response.Appleseeds.length; i++) {
if (Apple.Appleseeds.Id == response.Appleseeds.Id) {
Apple.Size = response.Appleseeds.Size;
}
}
});
})(Apples[i]);
}
};
Because http doesn't happen instantly, by the time the last success has happened in your code apple has been changed. By wrapping it in a closure you make it so that each call has it's own private Apple.
var deferred = $q.defer();
var someFunct = function() {
for (var i = 0; i < Apples.length; i++) {
$http.get("APIUrl" + Apples[i].Id).
success(function (response) {
deferred.resolve(response)
})
return deferred.promise;
}
}
someFunct().then(function(d)){
// write your code here
}

Categories

Resources