A New Way explainer

The aim of this puzzle: Use .pop() to take the last element off an array, and then edit it and use .push() to put it back.

Walkthrough of the solution: The 1st line will import an array called travelToCities from the grasshopper.travel module. The items in this array are objects, and each one has 4 properties: destination, transportMode, cost, and country.

The last object in the array is “popped” of and stored in a variable called atlantaTravel. This is the object you added in the previous lesson. Then the transportMode property is changed to 'hovercraft'.

Now that the object has been edited, you can add it back to the end of the array using .push(). You’ll need to use travelToCities.push(atlantaTravel) to do that.

The next code stores the last element in the array to a variable called last. This will be the same as the atlantaTravel object since you just pushed it onto the array.

Sample code solution:
(Tap below to reveal)

import { travelToCities } from 'grasshopper.travel';

let atlantaTravel = travelToCities.pop();
atlantaTravel.transportMode = 'hovercraft';

travelToCities.push(atlantaTravel);

let last = travelToCities[travelToCities.length - 1];

console.log(last.destination);
console.log(last.transportMode);

JavaScript Concepts: console.log(), Data Structures (arrays, objects), import, Indexing, .length(), .pop(), Variable Scope (let)
Additional Code (hidden code that runs before the puzzle’s code):

const travelToCities = [
    {destination: "Brazzaville", transportMode: "car", cost: 74, country: "Grasslandia"},
    {destination: "Budapest", transportMode: "boat", cost: 165, country: "Atlantis"},
    {destination: "Springfield", transportMode: "plane", cost: 171, country: "Hoptopia"},
    {destination: 'Atlanta', transportMode: 'boat', cost: 200, country: 'Hoptopia'}
];
4 Likes

Don’t get it… someone help

2 Likes

@discobot help I don’t understand this puzzle.

Hi! To find out what I can do, say @discobot display help.

@discobot display help

I currently know how to do the following things:

@discobot start new user

Starts one of the following interactive narratives: new user, advanced user.

@discobot roll 2d6

:game_die: 3, 6

@discobot quote

:left_speech_bubble: Carry out a random act of kindness, with no expectation of reward, safe in the knowledge that one day someone might do the same for you — Princess Diana

@discobot fortune

:crystal_ball: You may rely on it

I did not learn anything here.
I simply copied an image of the answer, split
Screened it and copied the answer.

I would like to understand what I had done so as not to be incompetent when I face such a problem again.

Someone please explain or point me to a layman explanation…

2 Likes

Hey there, happy to help!

Think of the array in this puzzle as a row of books on a bookshelf. In this lesson, you’re going to take the last book down, change a chapter in the book, and then put it back on the shelf in the same place you found it.

travelToCities is an array. Think of it as the row of books. .pop() is used to take the last element off of an array.

Take a look at this line:

atlantaTravel = travelToCities.pop()

This line is taking the last element out of the array travelToCities, and saving it to a variable called atlantaTravel. This is like taking the last book off of the bookshelf, and then saving it to a variable so we can edit it.

The element we took out of the array and saved to atlantaTravel is an object with the properties destination, transportMode, cost, and country. We are going to change the property transportMode with this line:

atlantaTravel.transportMode = 'hovercraft'

Now that we have made the changes we wanted to make, we need to put the element back into the array travelToCities. We will use .push() to do this. .push() takes the element you want to add inside its parentheses, and sticks it on to the end of the array you call it on. This line of code says, “Take the variable atlantaTravel, and add it to the end of the travelToCities array.”

travelToCities.push(atlantaTravel)

We have now put the book back on the bookshelf.

Now let’s take a look at our work, by using console.log() to print the element we just put back in the array.

The line let last = travelToCities[travelToCities.length-1] is a way for us to save the last element in the array to a variable, so we have a shorter way of referring to it in the console.log() statements.

Without this, our console.log() statements would look like console.log(travelToCities[travelToCities.length - 1].destination), which would look pretty messy. Saving the last element in the array to a variable called last makes the code look cleaner and more readable.

We then use this shortcut in our console.log() statements:
console.log(last.destination) will print out the destination property of the element we just added back to the array.
console.log(last.transportMode) will print out the transportMode property of the element we just added.

I hope this is helpful. If you have any more questions I will be happy to answer them!

-Ben

23 Likes

need help… this is tough for a 5th grader!

3 Likes

Ben did a more detailed explanation of this puzzle. If you follow along, it should make more sense. Let me know if there’s any part of it I can clear up.

–Frankie

2 Likes

@Grasshopper_Ben
@Grasshopper_Frankie

I could be mistaken, but is it possible that users haven’t learned about squared brackets at this point of the course? I only remembered from another old python course that you can call elements within an array with that. Otherwise the context wouldn’t be clear in this lesson?

2 Likes

There is too much information not given in this series of lessons. The imported code needs to visible for these lessons to make sense, otherwise I just have to take your word for it that any of the items you say are in the array are there.

1 Like

I have apparently garbled the starting code and it tells me to press the reset button. There is no reset button. I am on Amazon HD 10 fire tablet with app sideloaded.

Am I missing something?

Hey there,

The reset button is at the top of the code keyboard. It looks like the browser refresh button.

Hope this helps!
Ben

Instead of using

let last = travelToCities[travelToCities.length - 1✎];

Can we use

let last = travelToCities[atlantaTravel];

if we know the name of element? Or is the element only called by indexing?

2 Likes

To access an item in an array, we use the index number where the item is located. For example, the first item is at index 0, the 2nd item is at index 1, and so on. Accessing them looks like this:

let iceCreams = ['chocolate', 'vanilla', 'cookie dough'];
console.log(iceCreams[2]) // this prints cookie dough

Hope this helps!
Ben

3 Likes

Why is A New Way telling me Ive done it wrong when it’s printing the same as in the example. I cant see where I’ve gone wrong sorry

After the 7th line add

travelToCities.push(atlantaTravel)

There’s a mistake in the 8th-10th lines

Correction:

let last = travelToCities[travelToCities.length - 1];

2 Likes

I know, right? I had the same problem

So the travelToCities.length - 1 is where the just added item is located.??