I'm having a hard time visualizing it (Stand in Line)

Tell us what’s happening:

I’m having a hard time visualizing what is happening with the code, and even though I watched a video about it, I still have a hard time understanding what’s going on.

I think I do understand it. The function I set up pushes the entered number value (the “item” in (arr, item)), to the back, and removes whatever number is in front, but saves it.

It may seem like a random question, but is there software, videos or games that kind of give a visual example of the flow of some scripts and functions? I’m not talking about an elaborate animation, just like some line or flow chart or something.

Your code so far


function nextInLine(arr, item) {
  // Your code here
  arr.push(item);
  var removed = arr.shift(item);
  return removed;  // Change this line
}

// Test Setup
var testArr = [1,2,3,4,5];

// Display Code
console.log("Before: " + JSON.stringify(testArr));
console.log(nextInLine(testArr, 6)); // Modify this line to test
console.log("After: " + JSON.stringify(testArr));

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.102 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line

Pythontutor has a visualization tool that steps through code as it executes. Here is your code from above.

1 Like

Hey that’s pretty cool! It should be a browser plug-in or something.