Does the order of the comparison conditions matter when using OR operators in an IF function?

Question

I'm trying to get a better understanding of the conditions within an IF statement. When I change the order of the conditions I receive a TypeError of undefined.

I receive a TypeError: Cannot read property 'length' of undefined when the order is changed to:

if (col === maze[row].length || row < 0 || col < 0 || row === maze.length) {
    return
}

Does the order of the comparisons matter when using OR operators in an IF function? What is causing the TypeError when the order is written differently?

Working code base:

const maze = [
  [' ', ' ', ' ', '*', ' ', ' ', ' '],
  ['*', '*', ' ', '*', ' ', '*', ' '],
  [' ', ' ', ' ', ' ', ' ', ' ', ' '],
  [' ', '*', '*', '*', '*', '*', ' '],
  [' ', ' ', ' ', ' ', ' ', ' ', 'e'],
];

const solve = (maze, row = 0, col = 0, path = "") => {

  if (row < 0 || col < 0 || row === maze.length || col === maze[row].length) {
    return
  }

  // Base case
  if (maze[row][col] === "e") {
    return console.log(`Solved at (${row}, ${col})! Path to exit: ${path}`)

    // General case
  } else if (maze[row][col] === "*") {
    return
  }

  // Marker
  maze[row][col] = "*"

  // Right
  solve(maze, row, col + 1, path.concat("R"))

  // Down
  solve(maze, row + 1, col, path.concat("D"))

  // Left
  solve(maze, row, col - 1, path.concat("L"))

  // Up
  solve(maze, row - 1, col, path.concat("U"))

  // Remove marker
  maze[row][col] = " "
}

console.log(solve(maze));

Answer 1

You need to keep two things in mind.

1. Javascript evaluation is from left to right.
2. The OR || operator is short circuiting. Which means the first time it encounters a true expression it "short-circuits" i.e. bypasses all other expressions and just returns a true. This is basic boolean algebra.

In regards to your doubt about the TypeError: Cannot read property 'length' of undefined, either of maze[row] or maze is undefined. On running your snippet it turns out to be that maze[row] is the culprit here. This might be because since you do a row-1, in your code row might become negative causing maze[row] to be undefined.

If you turn the order to

if (row < 0 || col < 0 || col === maze[row].length || row === maze.length) {
    return
  }

whenever row < 0 i.e negative the OR operation short circuits all the other expressions. Hence maze[row].length is never evaluated and no undefined behaviour is encountered.