SyntaxError: Unexpected token

SyntaxError: Unexpected token ';' (V8-based)
SyntaxError: Unexpected identifier 'x' (V8-based)
SyntaxError: Unexpected number (V8-based)
SyntaxError: Unexpected string (V8-based)
SyntaxError: Unexpected regular expression (V8-based)
SyntaxError: Unexpected template string (V8-based)

SyntaxError: unexpected token: identifier (Firefox)
SyntaxError: expected expression, got "x" (Firefox)
SyntaxError: expected property name, got "x" (Firefox)
SyntaxError: expected target, got "x" (Firefox)
SyntaxError: expected meta, got "x" (Firefox)
SyntaxError: expected rest argument name, got "x" (Firefox)
SyntaxError: expected closing parenthesis, got "x" (Firefox)

A specific language construct was expected, but something else was provided. This might be a simple typo.

For example, when chaining expressions, trailing commas are not allowed.

for (let i = 0; i < 5,; ++i) {
  console.log(i);
}
// Uncaught SyntaxError: expected expression, got ';'

Correct would be omitting the comma or adding another expression:

for (let i = 0; i < 5; ++i) {
  console.log(i);
}

Sometimes, you leave out parentheses around if statements:

function round(n, upperBound, lowerBound) {
if (n > upperBound) || (n < lowerBound) { // Missing parentheses here!
    throw new Error(`Number ${n} is more than ${upperBound} or less than ${lowerBound}`);
  } else if (n < (upperBound + lowerBound) / 2) {
    return lowerBound;
  } else {
    return upperBound;
  }
} // SyntaxError: expected expression, got '||'

The parentheses may look correct at first, but note how the || is outside the parentheses. Correct would be putting parentheses around the ||:

function round(n, upperBound, lowerBound) {
  if ((n > upperBound) || (n < lowerBound)) {
    throw new Error(
      `Number ${n} is more than ${upperBound} or less than ${lowerBound}`,
    );
  } else if (n < (upperBound + lowerBound) / 2) {
    return lowerBound;
  } else {
    return upperBound;
  }
}

Sometimes, the error is caused by some structure issues not directly next to the error location, so you need to look around for potential errors. For example, you intended to declare a method of an object, but you declared it as a propety instead:

const MyComponent = {
  mounted: {
    document.getElementById("app").classList.add("loaded");
  }
}

The . after document is unexpected, because JavaScript is parsing the {} as an object literal instead of a function body, so it expects a :. The problem is solved by declaring mounted as function.

const MyComponent = {
  mounted() {
    document.getElementById("app").classList.add("loaded");
  }
}

• SyntaxError