Bug in JavaScript Code? For loop vs Foreach loop [duplicate]

Question

I have the same bit of code written in two different ways, and the only difference between them is that one uses a for loop, while the other uses a foreach loop. However, they seem to give different results.

Images of the results can be found at the bottom.

The bit of code checks if the blue rectangles intersect with the purple or the gray ones, and if they do, return false. This bit of code is run each time a new blue rectangle is created

The purpose of this is to make sure no blue rectangles are outside the area delimited by the gray area nor inside the green area

const USE_FOR = true;

// wall.type: string value, possible values: 'bound', 'base', 'random'
// CONFIG.wall.bound_type: 'gray'
// CONFIG.wall.base_type: 'base'

// 'bound' type: gray rectangles
// 'base' type: purple rectangles
// 'random' type: blue rectangles
if (USE_FOR) {
    for (let i = 0; i < walls.length; i++) {
        let wall = walls[i];

        if (wall.type == CONFIG.wall.base_type || wall.type == CONFIG.wall.bound_type) {
            if (isCollision(wall.getArea(), area)) {
                return false;
            }
        }
    }
} else {
    walls.forEach((wall) => {
        if (wall.type == CONFIG.wall.base_type || wall.type == CONFIG.wall.bound_type) {
            if (isCollision(wall.getArea(), area)) {
                return false;
            }
        }
    });
}

return true;

Result from using the for loop

Result from using the foreach loop

return in for loop exits the outer function. return in foreach loop only exits the anon function inside (which does nothing) — nhahtdh
– nhahtdh, Commented May 13, 2020 at 6:47

Amardeep Bhowmick · Accepted Answer · 2020-05-13 07:12:20Z

0

Instead of using Array.prototype.forEach your can use Array.prototype.some to return when your predicate has matched:

const array = [1, 2, 3, 4, 5];

function demoFor(array, predicate, useFor = true) {
  if (useFor) {
    for (let i = 0; i < array.length; i++) {
      if (predicate(array[i])) return false;
      else console.log(array[i]);
    }
  } else {
    return !array.some((e) => {
      if (predicate(e)) return true;
      else console.log(e);
    });
  }
}
const predicate = (e) => e === 3;
console.log("Using for loop");
demoFor(array, predicate, true);
console.log("Using some");
demoFor(array, predicate, false);

edited May 13, 2020 at 7:12

answered May 13, 2020 at 7:04

Amardeep Bhowmick

17k3 gold badges33 silver badges46 bronze badges

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

Collectives™ on Stack Overflow

Bug in JavaScript Code? For loop vs Foreach loop [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related