6

In a class I am taking they give an example of editing an Array's contents with a forEach() loop.

Classes Example:

var donuts = ["jelly donut", "chocolate donut", "glazed donut"];

donuts.forEach(function(donut) {
  donut += " hole";
  donut = donut.toUpperCase();
  console.log(donut);
});

Prints:
JELLY DONUT HOLE
CHOCOLATE DONUT HOLE
GLAZED DONUT HOLE

The problem is when I try to solve a quiz problem using the same technique it doesn't change the arrays values. I believe this has to do with the if statement but they ask us to use it, so why would they not tell us there is an issue?

My Code:

/*
 * Programming Quiz: Another Type of Loop (6-8)
 *
 * Use the existing `test` variable and write a `forEach` loop
 * that adds 100 to each number that is divisible by 3.
 *
 * Things to note:
 *  - you must use an `if` statement to verify code is divisible by 3
 *  - you can use `console.log` to verify the `test` variable when you're finished looping
 */

var test = [12, 929, 11, 3, 199, 1000, 7, 1, 24, 37, 4,
    19, 300, 3775, 299, 36, 209, 148, 169, 299,
    6, 109, 20, 58, 139, 59, 3, 1, 139
];

test.forEach(function(element){
    if (element % 3 === 0){
        element += 100;
        return element
    }
});

console.log(test);

I have tried running return statements but no luck. I reached out to their "Live Help" but they were less than helpful. Can someone please tell me what I am not seeing here?

Improve this question
8
  • 3
    Shouldn’t you use map? forEach is not appropriate in this scenario. donut is passed into the callback function by value, not by reference. Editing donut only edits the local copy of that string. If donut were an object, you could actually mutate it, because those are passed by reference. The classes’ example doesn’t change the original array as well. Commented Oct 16, 2017 at 2:29
  • 5
    return in forEach does nothing... nowhere to return to Commented Oct 16, 2017 at 2:31
  • 1
    map doesn't modify the array either, it creates a new one. Commented Oct 16, 2017 at 2:32
  • I'm just doing what they tell me. I'm just skipping this and deleting the question. Thank you for pointing that out! They aren't very clearly asking what they want here. Commented Oct 16, 2017 at 2:33
  • 1
    You could leave it for future people to learn from. Commented Oct 16, 2017 at 2:34

3 Answers 3

Reset to default
14

The forEach method of an array does not modify the array, it just iterates over it. When you change the argument in the callback function, that doesn't affect the array either. Also, forEach doesn't do anything with the return values from the callback. Once you calculate the value you want to use to replace, you can set it using the index and array arguments, like so.

var test = [12, 929, 11, 3, 199, 1000, 7, 1, 24, 37, 4,
    19, 300, 3775, 299, 36, 209, 148, 169, 299,
    6, 109, 20, 58, 139, 59, 3, 1, 139
];

test.forEach(function(element, index, array){
    if (element % 3 === 0){
        element += 100;
        array[index] = element;
    }
});

console.log(test);

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Thank you. I think this is what they are asking for, but they sure don't explain any of this beforehand. I really appreciate it.
This answer is fine as far as it goes, but seems woefully incomplete without mentioning map.
I don't feel like map was the right method for the job, and so I didn't mention it. Neither do I feel reduce or any other array iterator method does any better than forEach does, so I left it at that.
5

You're not passing the reference for each value into the callback, just the value. So you're updating a local value without actually editing the array.

You can update the array by passing the index into the callback and then editing the value at that index.

test.forEach(function(element,index){ 
    if (element % 3 === 0){ 
        test[index] = element + 100; 
    } 
});
Improve this answer

Comments

0

just pass the index on the array then it will be modified.

var test = [12, 929, 11, 3, 199, 1000, 7, 1, 24, 37, 4,
19, 300, 3775, 299, 36, 209, 148, 169, 299,
6, 109, 20, 58, 139, 59, 3, 1, 139
];

test.forEach(function(element, index){
    if (element % 3 === 0){
        test[index] += 100;
    }
});

console.log(test);
Improve this answer

1 Comment

Actually, this is poor practice. If you want to modify the elements of an array, that's what map is for.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.