ホーム › エラー解決 › JavaScript › Unexpected token

JavaScript ERROR

JavaScript SyntaxError: Unexpected token の直し方（How to Fix）

Q: Unexpected token < と出る

JavaScriptとして読み込んだファイルの中身がHTMLです。scriptのパスが誤って404ページを返している、またはfetchのAPIがエラーHTMLを返しています。Networkタブで実際のレスポンスを確認してください。

Q: Unexpected end of input との違いは？

Unexpected tokenは「余分・不正な記号がある」、Unexpected end of inputは「閉じカッコが足りない」です。前者は削る方向、後者は足す方向で探します。

Q: Invalid or unexpected token と Unexpected token は同じ？

別のエラーです。Invalid or unexpected tokenは全角スペース・全角引用符・BOMなど、そもそもJSの字句として認識できない文字が混ざっているときに出ます。

Q: カッコの数は合っているのに直りません

全角スペースや全角引用符が混入している可能性が高いです。エディタで空白文字の表示をONにし、ファイルをUTF-8（BOMなし）で保存し直してください。

Q: Unexpected token o in JSON at position 1 とは？

JSON.parse()に文字列ではなくオブジェクトを渡しています。[object Object]のoを読んでいる状態です。すでにオブジェクトならparseは不要です。

Q: Unexpected token export と出ます

ESモジュールを通常スクリプトとして読み込んでいます。ブラウザではscriptにtype="module"を、Node.jsでは拡張子.mjsかpackage.jsonの"type": "module"を指定してください。

Q: エラーの行番号が実際の場所とずれます

構文エラーはパーサーが破綻した位置で報告されるため、真の原因は示された行の1つ手前や上のブロックにあることが多いです。上方向にさかのぼって確認してください。

文法の区切り記号がおかしいときのエラーです。カッコ・カンマの過不足が主な原因です。How to fix "SyntaxError: Unexpected token": 示された位置の直前にある閉じ忘れ・余分なカンマ・全角文字を探します。下のチェッカーにコードを貼れば原因のヒントが即表示されます。

🔍 構文エラーチェッカー（コードを貼るだけ）

JavaScriptを貼ると、ブラウザのJSエンジンが構文だけをチェックしてエラー内容と原因のヒントを表示します（コードは実行されず、送信もされません）。

このエラーメッセージ

SyntaxError: Unexpected token ')'

原因

カッコ { } ( ) [ ] の閉じ忘れ・過剰
カンマやセミコロンの付け忘れ・余分
JSON.parseに不正な文字列を渡している

❌ エラーになるコード

const nums = [1, 2, 3,];
const total = nums.reduce((a, b) => a + b);
console.log(total);;)

✅ 修正したコード

const nums = [1, 2, 3];
const total = nums.reduce((a, b) => a + b, 0);
console.log(total);

▶ 修正済みコードを実行エディタで開く

progoのJavaScript実行環境（インストール不要・登録不要）でその場で動作を確認できます。

解決のポイント

エラーで示された記号の直前を疑います。カッコの対応が取れているか、余分な)や;が無いかを確認しましょう。エディタの括弧ハイライトが役立ちます。

メッセージ別・原因早見表

同じSyntaxErrorでも、後ろに続く文言で原因はほぼ特定できます。まず自分のメッセージを探してください。

メッセージ	いちばん多い原因
`Unexpected token ')'` / `'}'` / `']'`	閉じカッコが余っている、または直前でカンマ・演算子が抜けている
`Unexpected token '<'`	JSのつもりでHTMLを読み込んでいる（404ページやエラーページのHTMLが返っている）
`Unexpected end of input`	閉じカッコ・閉じ波カッコが足りない（ファイルが途中で終わっている扱い）
`Invalid or unexpected token`	全角スペース・全角引用符・BOM・文字列の閉じ忘れなど「文字そのもの」が不正
`Unexpected token 'export'` / `'import'`	ESモジュールを通常スクリプトとして読み込んでいる
`Unexpected token o in JSON at position 1`	`JSON.parse()`にオブジェクトや非JSON文字列を渡している
`Unexpected token ':'`	オブジェクトリテラルを式の位置以外で書いている／JSONをJSとして貼り付けている

Invalid or unexpected token（不正なトークン）の直し方

Uncaught SyntaxError: Invalid or unexpected tokenはUnexpected tokenとは別物で、「JavaScriptとして解釈できない文字が混ざっている」ことを示します。カッコの数は合っているのに直らない場合はこちらを疑ってください。

全角スペース（）— 日本語入力のまま書いたインデントに紛れる最頻原因
全角の引用符 “ ” ‘ ’ — ブログやWordからコピペしたコードで発生
BOM付きUTF-8 — ファイル先頭に見えない文字。エディタで「UTF-8（BOMなし）」で保存し直す
文字列の閉じ忘れ・改行またぎ — "で始めた文字列を閉じずに改行している
文字列内のバックスラッシュ — Windowsのパスは"C:\tmp"のようにエスケープする

const　name = "progo";   // ← = の前が全角スペース
const msg = “Hello”;      // ← 引用符が全角
console.log(name, msg);

const name = "progo";
const msg = "Hello";
console.log(name, msg);

エディタで「空白文字を表示」をONにすると全角スペースが可視化され、一目で見つかります。

Unexpected token '<' はJSではなくHTMLが返っている

<が出たときはコードではなく読み込み側の問題です。ブラウザの開発者ツール（Networkタブ）で該当の.jsのレスポンスを見ると、中身がHTMLになっているはずです。

<script src>のパスが違い、サーバーが404ページのHTMLを返している
SPAのルーティングで、存在しないJSへのリクエストがindex.htmlに吸われている
fetch()の結果をres.json()したが、APIがエラーHTMLを返している（この場合はUnexpected token '<', "<!DOCTYPE "... is not valid JSON）

APIレスポンスはres.json()の前にres.okとContent-Typeを確認するのが安全です。

const res = await fetch("/api/users");
if (!res.ok) throw new Error("HTTP " + res.status);
const ct = res.headers.get("content-type") || "";
if (!ct.includes("application/json")) {
  const text = await res.text();
  throw new Error("JSONではありません: " + text.slice(0, 80));
}
const data = await res.json();
console.log(data);

Unexpected end of input（閉じカッコ不足）

SyntaxError: Unexpected end of inputは「まだ閉じていないのにファイルが終わった」という意味です。足りないケースなので、Unexpected tokenとは逆方向に探します。

function・if・forの}の閉じ忘れ
コールバックの})を}だけで終えている
複数行コメント/*を閉じておらず、以降が全部コメント扱いになっている
JSON.parse()に途中で切れたJSON文字列を渡している（Unexpected end of JSON input）

エディタで開き波カッコにカーソルを置くと対応する閉じカッコがハイライトされます。ハイライトされない＝そこが未対応です。整形（Prettier / VS CodeのShift+Alt+F）をかけると、インデントが崩れた位置が不足箇所の目印になります。

Unexpected token 'export' / 'import' はモジュール指定漏れ

import・exportはESモジュールでのみ使えます。通常スクリプトとして読み込むと構文エラーになります。

ブラウザ：<script type="module" src="app.js"></script>にする
Node.js：拡張子を.mjsにする、またはpackage.jsonに"type": "module"を追加する
逆にESモジュール内でrequire()を使うとrequire is not definedになります（ReferenceErrorを参照）

エラー行の見つけ方（3ステップ）

1. コンソールに出たファイル名:行:桁を開く。構文エラーは示された位置の1つ前に原因があることが多い
2. その行から上へ、直近の開きカッコ・引用符・コメントの対応を確認する
3. 直らなければ、疑わしい範囲を半分ずつコメントアウトして二分探索する。エラーが消えた側に原因がある

下のエディタにコードを貼り付けて実行すれば、行番号付きでエラーがその場で確認できます。

🧰 他のチェッカー

Pythonインデント診断 JSON検証ツール undefined原因箇所チェッカー

よくある質問

Unexpected token < と出る