Error/Warning in Javascript: Function inside loop

Question

I'm new to JavaScript, and am learning it from an online tutorial. The current expression is about the use of function expressions, and specifically - returning a function expression from inside a function.

Here's the code:

//array of all available rides, with respective wait times
var parkRides = [["Birch Bumpers", 40], ["Pines Plunge", 55], ["Cedar Coaster", 20], ["Ferris Wheel of Firs", 90]];

//array of fast pass rides, indicating next up ride
var fastPassQueue = ["Cedar Coaster", "Pines Plunge", "Birch Bumpers", "Pines Plunge"];

//function to build fast pass queue using array
function buildTicket(allRides, passRides, pick) {

    //if user has picked the first ride in fast pass queue, alert so...
    if(pick == passRides[0]) {

        //remove first item from queue using shift and store it in a var
        var pass = passRides.shift();

        //return function expression here
        return function () {
            alert("QuicK!! You've got a fast pass to " + pass + "!");
        };  //return ends with a ;

    }

    else {
        for (var i = 0; i < allRides.length; i++) {
            if(pick == allRides[i][0]) {

                //return a function expression here
                return function () {
                    alert("A ticket is printing for " + allRides[i][0] +"!\n"+ " Your wait time is about " + allRides[i][1] + " minutes.");
                };
            }

        }
    }

}

//use function buildticket
var wantsRide = "Pines Plunge";

var ticket = buildTicket(parkRides, fastPassQueue, wantsRide);

//execute function expression by calling ticket()
ticket();

I'm using MS Visual Studio Code, and at the end of the code, I get one error and one warning, even though the code successfully works, and I get the desired result depending on the wantsRide variable. However, I failed to understand the reason for the error and warning.

At the bottom of the screen(screenshot below), I get 1 cross and 1 exclamation icon, I assume that means 1 error and 1 warning.

enter image description here

But when I click on it, I get a highlighted area on the top of the bar that says ! Function inside loop and these lines are highlighted:

return function () {
                    alert("A ticket is printing for " + allRides[i][0] +"!\n"+ " Your wait time is about " + allRides[i][3] + " minutes.");
                };

enter image description here

What seems to be the problem here? I know it's a function expression inside a for loop, but why is the warning generated? Is it because it the if(pick==allRides[i][0]) statement might never be true, so the function expression would never get executed?

It's a warning that your code may have the problem described here: http://stackoverflow.com/questions/1451009/javascript-infamous-loop-issue — Barmar, May 08 '15 at 23:20
But in this case, it doesn't have the problem, because it also returns out of the loop when it creates the function. — Barmar, May 08 '15 at 23:22
@Barmar — The linter you are using isn't smart enough to determine that. — Quentin, May 12 '15 at 13:22
@Quentin It's the kind of thing that can be difficult to determine from static analysis. — Barmar, May 12 '15 at 15:43

score 0 · Answer 1 · edited May 23 '17 at 11:58

It's a bit of a shot in the dark, but it may be that MSVS is failing to understand what it is that your function is returning (i.e. another function).

This question may shed some light on the issue:

Create javascript function that works with intellisense

(or I could be barking up entirely the wrong tree)

So it may work better in MSVS if you define the return value as a variable of type "function" and redefine it later as appropriate. Something like:

//function to build fast pass queue using array
function buildTicket(allRides, passRides, pick) {

    var func = new function() {}

    //if user has picked the first ride in fast pass queue, alert so...
    if(pick == passRides[0]) {

        //remove first item from queue using shift and store it in a var
        var pass = passRides.shift();

        func = function () {
            alert("QuicK!! You've got a fast pass to " + pass + "!");
        };  //return ends with a ;
        //return function expression here
        return func;

    }

    else {
        for (var i = 0; i < allRides.length; i++) {
            if(pick == allRides[i][0]) {

                func = function () {
                    alert("A ticket is printing for " + allRides[i][0] +"!\n"+ " Your wait time is about " + allRides[i][1] + " minutes.");
                };
                //return a function expression here
                return func;
            }

        }
    }

}

although this does not account for why MSVS complains about the 2nd return call and not the 1st (or both), so I could be completely wrong (I don't have or use MSVS).

Error/Warning in Javascript: Function inside loop

1 Answers1