Helping for understanding: Stand in Line

JavaScript
#1

Tell us what’s happening:
Hi,
I got this challenge figured out only after reading the help section. But I still need to understand what happened here. I am really confused what the .push and .shift really do in this context and why it worked.

Any explanation for helping me to understand this is greatly appreciated.

Your code so far


function nextInLine(arr, item) {
  // Your code here
  arr.push(item);
 

  return arr.shift();  // 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 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36.

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

#2

I think the biggest source of confusion can be the difference between the ‘effect’ and the value returned.
First of all here some references: MDN push, MDN Shift .

You can see that:

  • push method will add one or more element at the end of the array, and return the array length after the addition
  • shift method will remove an element from the top of the array and return the element removed.

So, that function will add the second argument at the end of the array and removes the first one from the start returning it^^

#3