JavaScript整形ツール
JavaScript整形ツールは、圧縮されたコードや空白が不統一なソースを、確認・説明・レビューしやすい形式に変換します。ミニファイ済みスクリプト、バンドル内の断片、インラインハンドラー、生成コードを貼り付けると、2スペースのインデントと文末の改行を備えた再現可能な結果が得られます。文字列、テンプレートリテラル、コメント、正規表現を保護しながら構造的な記号を整形し、対応しない丸括弧、角括弧、波括弧や閉じ忘れもエラーとして扱います。
無料で実行
圧縮されたJavaScriptを読みやすくします
ブラウザーへ配信するJavaScriptは転送量を抑えるためにミニファイされることが多い一方、そのコンパクトな表現は人が追跡するには不向きです。関数本体、変数宣言、呼び出し、条件、return文が1本の長い行に並ぶこともあります。本ツールは、送信されたプログラムを実行せずに、安定した視覚的な階層を復元します。開始波括弧でインデントしたブロックを始め、終了波括弧で前の階層に戻り、括弧式の外にある文末セミコロンの後で改行します。各階層には2スペースを使用するため、繰り返し処理しても同じ結果になり、メモ、チケット、コードレビュー、エディターで扱いやすくなります。ブラウザー、ビルドディレクトリ、埋め込みスクリプト、診断レスポンスから取得したソースしかない場合に特に便利です。変数名の変更、バンドルされたモジュールの展開、ソースマップの復元、作者固有の書式の再現は行いません。入力されたプログラムの意味のある文字を保ちながら、見える構造を明確に示すことに専念します。
文字列、コメント、テンプレート、正規表現を保護します
JavaScriptでは文脈によって記号の意味が変わるため、すべての波括弧やセミコロンで単純に分割することはできません。引用符内のメッセージに含まれるセミコロンはデータです。正規表現の角括弧は文字クラスを表し、テンプレートリテラル内の波括弧は内容になり得ます。コメント内の記号もプログラム構造を変えてはいけません。そのため、単一引用符と二重引用符の文字列、エスケープシーケンス、テンプレートリテラル、行コメント、ブロックコメント、正規表現を追跡します。構造的な整形は、これらの保護領域の外側だけで行います。丸括弧も追跡するので、従来形式のforヘッダーにあるセミコロンは同じ行に保たれます。この決定論的な走査では、ネットワーク、時刻、乱数、モデル、実行時評価を使用しません。同じ入力からは常に同じ出力が得られ、送信されたJavaScriptが実行されることもありません。人による確認や後続ツールには適していますが、完全な標準パーサーやプロジェクト固有のフォーマッターを置き換えるものではありません。
次の工程の前に不完全な区切り記号を検出します
扱いにくい場所からコードをコピーしたために整形が必要になることは多く、その際に先頭や末尾の文字が欠ける場合があります。本ツールは構造的な開始記号を入れ子のスタックで管理し、すべての終了記号を対応する開始記号と照合します。予期しない終了丸括弧、角括弧、波括弧があれば、直ちに無効入力エラーを返します。開始記号が閉じられないまま末尾に達した場合も、見た目だけ整った結果を返さずに失敗します。保護された文字列、コメント、テンプレートリテラル、正規表現内の区切り記号は内容として扱います。この検査は意図的に範囲を限定しています。区切り記号が対応していても、識別子、演算子、宣言、モジュール構文、制御フローまで正しいJavaScriptであるとは限らず、コードの動作確認も行いません。それでも、文書化、レビュー、比較、専門パーサーへ渡す前に、コピー時の欠落や不一致を見つける有用な手掛かりになります。ブラウザーではローカルで整形でき、自動APIリクエストには1項目当たり公開基本料金$0.002が適用されます。
活用例
ミニファイ済みブラウザー資産を調査
関数、イベントハンドラー、不審な呼び出しを追跡する前に、圧縮スクリプトをインデント付きブロックと文の行へ展開します。
レビュー用の断片を準備
生成されたJavaScriptや書式が不統一なコードを再現可能に整え、動作と構造に集中してレビューできるようにします。
コピーしたスクリプト断片を確認
文書や別のツールへ貼り付ける前に、丸括弧、角括弧、波括弧の欠落や不一致を検出します。
よくある質問
どのような書式が適用されますか?
ブロック階層ごとに2スペースでインデントし、括弧式の外ではセミコロンで終わる文を新しい行に配置します。
送信したJavaScriptは実行されますか?
いいえ。テキストを決定論的に走査するだけで、提供されたコードを評価または実行することはありません。
文字列、コメント、テンプレート、正規表現は保持されますか?
はい。周囲のコードを解析する間も、その内容は構造的な改行から保護されます。
記号の対応が取れていれば有効なJavaScriptですか?
いいえ。区切り記号と整形境界は確認しますが、ECMAScript構文全体を検証するものではありません。
APIリクエストの料金はいくらですか?
各APIリクエストには公開基本料金$0.002が適用されます。ブラウザー版はAPIリクエストなしでローカル実行できます。
開発者向け — APIアクセス
このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。
エンドポイント
Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。
お使いのスタックから呼び出す
curl -X POST https://api.kit.forhosting.com/dev2/beautify-js \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"javascript":"function greet(name){const message=`Hello, ${name}!`;console.log(message);return message;}"}'const res = await fetch("https://api.kit.forhosting.com/dev2/beautify-js", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"javascript": "function greet(name){const message=`Hello, ${name}!`;console.log(message);return message;}"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/dev2/beautify-js",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"javascript": "function greet(name){const message=`Hello, ${name}!`;console.log(message);return message;}"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/dev2/beautify-js", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"javascript":"function greet(name){const message=`Hello, ${name}!`;console.log(message);return message;}"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"javascript":"function greet(name){const message=`Hello, ${name}!`;console.log(message);return message;}"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/dev2/beautify-js", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)リクエスト例
{
"javascript": "function greet(name){const message=`Hello, ${name}!`;console.log(message);return message;}"
}レスポンス例
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "dev2.beautify_js",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。
料金
単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。
エラー
| HTTP | コード | 意味 |
|---|---|---|
401 | unauthorized | APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。 |
402 | insufficient_balance | 残高が不足しています。チャージ後に再度お試しください。 |
404 | unknown_type | 指定されたタスクタイプは存在しません。タイプ名を確認してください。 |
429 | rate_limited | リクエストが多すぎます。しばらく待ってから再度お試しください。 |