FAQ: Arrays - Arrays and Functions

This community-built FAQ covers the “Arrays and Functions” exercise from the lesson “Arrays”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Web Development

Introduction To JavaScript

FAQs on the exercise Arrays and Functions

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head here.

Looking for motivation to keep learning? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

2 posts were split to a new topic: Where did arr and newArr come from and what do they do or mean?

2 posts were split to a new topic: Why can .pop() method change the structure of array that was defined as const variable?

Hello everyone. I’m at Arrays and Function, exercise 10. I just want to confirm that what is happening in this exercise is that we are changing the value of the global scope by changing the string ‘mutated’ to ‘MUTATED’ and then .pop it off. Considering where the braces {} are I just want to confirm.

1 Like

Hey everyone, i don’t understand why it is used the ‘=>’ operator before the body of the funcion (to be an operator shouldnt ‘=’ be after the ‘>’ signal?).

const removeElement = newArr => {
newArr.pop() _______________ ^
}

That is arrow function syntax.

const foo = param => {
    // function body
}

Much the same as,

const foo = function (param) {

}

with a few exceptions.

2 Likes

We are changing the elements within the array in global scope from within the function’s local/block scope. Even though the scopes are different, the function can do this because of pass-by-reference = if an array is passed into a function using an argument/parameter, any changes to the array’s elements within the function will also be made to the array outside the function. I also rationalise this by remembering that a child’s scope has access to its parent’s and ancestors’ scopes (but not vice versa) i.e. the scope hierarchy.

The first change the function makes is to reassign the value of the fourth element (index position 3) to 'MUTATED'.
The second change is to remove the last element using .pop()pop it off as you say - love it!! :joy::rofl: … which happens to be our friend 'MUTATED' (our old friend 'mutated') again. :wink:

2 Likes

This is because there are not two arrays, but one. The one seen inside the function is the global one referenced in the argument.

1 Like

Why is it that in exercise 10/12 the functions used in the exercise can’t be hoisted?

I thought that functions could be hoisted.

For example, if I log to the console the array concept before I call the function changeArr, the original array is printed with none of the mutations. But function declarations should be able to be hoisted.

Only declared functions are hoisted. Expressions are not.

foo()    // I'm a hoisted function

function foo() {
    console.log("I'm a hoisted function")
}

Hey, It looks like I’m unable to open the article of where arr and newArr come from. Can anyone explain it for me?

1 Like

The topic appears to have been deleted. for some reason.

arr and newArr are both formal parameters of their respective functions. They are declared in place and are local only to the function (have function scope). They do no exist outside, nor are they accessible from the outside.

Hi, I’m actually doing this lesson Arrays and Functions

I’m a bit confuse, what is the main interest using arr function ?
Because this is working :

const flowers = ['peony', 'daffodil', 'marigold'];

flowers.push('lily');

console.log(flowers);
// [ 'peony', 'daffodil', 'marigold', 'lily' ]

So why using this :

const flowers = ['peony', 'daffodil', 'marigold'];

function addFlower(arr) {
  arr.push('lily');
}

addFlower(flowers);

console.log(flowers);
// Output:    ['peony', 'daffodil', 'marigold', 'lily']

Using a function lets us add a flower to any array, not just the flowers array. This is advantageous as it allows us to write one piece of code, and then use and re-use as much as we need.

2 Likes

Ok, thanks @mtf , now I understand the usefulness of this.

1 Like

I did not understand one thing. How come (in the flowers example) the variable flowers containing the array and the function addFlower with the push method got connected. How does our program now that we want to push an element into the flowers array?

It knows because we supply the name of the array to push the new flower into.

function addFlower(arr) {  // arr is the parameter
  arr.push('lily');
}

addFlower(flowers);        //  flowers is the argument

thanks for explaining. just one more question. the arr argument inside the parameter is used inside the function, but if we want change the value of the argument later in the code how would we do it? And why add the the argument inside the function why not do it like we normally do?

Not sure I follow the question.

The function takes any array. If you want to add lily to arrangement then just pass that array.

I don’t get why we can’t directly edit the values inside an array. Why do we have to use separate code functions to do this?