SyntaxError: Unexpected token
当解析器在给定位置未能识别出某个 token 时，就会出现 JavaScript 异常“unexpected token”（意外的 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)
错误类型
SyntaxError
哪里出错了？
预期会有一个特定的语言结构，但提供了其他内容。这可能是一个简单的拼写错误。
示例
预期表达式
例如，在链式表达式中，不允许使用末尾逗号。
js
for (let i = 0; i < 5,; ++i) {
console.log(i);
}
// Uncaught SyntaxError: expected expression, got ';'
正确的方法是省略逗号或添加另一个表达式
js
for (let i = 0; i < 5; ++i) {
console.log(i);
}
括号不足
有时，您会在 if 语句周围遗漏括号
js
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 '||'
括号乍一看可能正确，但请注意 || 在括号之外。正确的方法是将 || 放在括号内
js
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;
}
}
上方的结构错误混淆了含义
有时，错误是由一些不直接在错误位置旁边的结构问题引起的，因此您需要查找潜在的错误。例如，您打算声明一个对象的方法，但却将其声明为属性
js
const MyComponent = {
mounted: {
document.getElementById("app").classList.add("loaded");
}
}
document 后的 . 是意外的，因为 JavaScript 将 {} 解析为对象字面量而不是函数体，所以它预期有一个 :。通过将 mounted 声明为函数来解决此问题。
js
const MyComponent = {
mounted() {
document.getElementById("app").classList.add("loaded");
}
}