Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Foundations Arrays Methods: Part 1

Storing array.unshift(1) into a another variable for console.log results in strange output. Why?

Hello!

I wonder why we can't save the value of array.unshift(1) into another variable, and then console it that way; however we can do it with shift(). If you run the code below, you will see what mean. something like these 2 consoles return 4????, but I was expecting 1,2,3,4 like in console.log(show.toString())

therse return 4??

console.log( 'this is save with toString() ' + save.toString());
    console.log( 'this is save without the toString() ' + save);

Cheers!!

<!DOCTYPE html>
<html lang="en">
  <head>
    <title> JavaScript Foundations: Arrays</title>
    <style>
      html {
        background: #FAFAFA;
        font-family: sans-serif;
      }
    </style>
  </head>
  <body>
    <h1>JavaScript Foundations</h1>
    <h2>Arrays: Getting and Setting</h2>
    <script>
     var show = [2,3,4];
    console.log( 'this is original show' + show.toString());

     var save = show.unshift(1);
     var value = show.shift();

    console.log( 'this is save with toString() ' + save.toString());
    console.log( 'this is save without the toString() ' + save);
    console.log( show.toString());
   console.log( 'this is value ' + value);  
   console.log( 'this is show, value, with toString()' + show.toString());

    </script>
  </body>
</html>

5 Answers

Both shift and unshift return a value which can be assigned to a variable.

Since unshift adds elements to the beginning of the array it returns the new length of the array. show starts off with a length of 3. Then show.unshift(1) adds 1 to the beginning of the array and the new length becomes 4. 4 is what is returned by that method call and so the variable save now has the value 4.

The shift method removes the first element from the array and returns that value. So show.shift(); is removing the 1 that was previously added with unshift, and then returning that value which is then assigned to the variable value. So value has the value 1.

Hello Jason,

Thanks a lot for your responses. Could you please show with a small script that unshift can be stored in a variable like 'shift' ,and this variable can be printed to console. If you run my code, you will see that unshift only works when we call it directly on the array element, but once we attach it to an array element and then store it in another variable, we can't console out this new variable.

Cheers!

Try running this script and see if it helps you:

var test = [2, 3, 4];
console.log ('test array: ' + test);
var newLength = test.unshift(1);
console.log ('After unshift method...');
console.log ('The new length of test array: ' + newLength);
console.log ('test array: ' + test);
var value = test.shift();
console.log ('After shift method...');
console.log ('The first element removed from test array: ' + value);
console.log ('test array: ' + test);

Concerning my first question, here is the code to make it easier to understand my question

 <!DOCTYPE html> 
<head>
</head>
<body> 
<script>
 var show = [2,3,4]; 
 console.log( 'this is original show array' + show.toString());

 var save = show.unshift(1);


console.log( ' Result of var save = show.unshift(1): ' + save.toString());

console.log('show.toString() without saving it in var save' +  show.toString());





</script>
</body>
</html>

When I run your code I get the following output:

this is original show array2,3,4
Result of var save = show.unshift(1): 4
show.toString() without saving it in var save1,2,3,4

This is what would be expected.

Maybe the confusion is that you think you're saving the show array in the save variable?

Hello Jason,

Yes, that is exactly my confusion. I think I am saving the result of show.unshift(1) into the variable called save, so I am expecting console.log(save) to print 1,2,3,4, but instead, all it prints in 4. I dont get it. Cheers!

Neither the shift method or the unshift method return the array. If you save the return value in a variable, neither one will output the array.

The unshift method returns the new length of the array. This is why the save variable is 4. The array now has 4 elements in it.

[1, 2, 3, 4]

Now, I understand what the 4 is. Thanks Jason!

You're welcome. Glad you have it sorted out now.