JavaScriptコードフォーマッター
ガイド
JavaScriptコードフォーマッター
ミニフィードされた、ごちゃごちゃした、または圧縮されたJavaScriptを貼り付け、読みやすいクリーンで一貫したフォーマットのバージョンを取得できます。フォーマッターはトークンを理解しており、文字列リテラル、テンプレートリテラル、正規表現、コメントを理解しているため、正規表現の内部を誤ってフォーマットしたり、あなたのを再配置したりしません。 ${...} すべてがブラウザで実行され、貼り付けたコードはあなたのマシンに残ります。
使用方法
- JavaScriptを入力ボックスに貼り付けます。
- インデント、引用記号のスタイル、セミコロンのポリシーを選択します。
- ブレースのスタイル(1TBSまたはAllman)およびトレーリングコマのポリシーを選択します。
- ターゲットの印刷幅を設定します——長いオブジェクトリテラルや配列は、フィットするように分割されます。
- フォーマットされた出力をコピーするか、または
.jsファイル。
機能
- 決定論的出力 — 同じ入力が常に同じ結果を生成します。
- 設定可能なインデント – 2スペース、4スペース、またはタブ。
- 引用記号の変換 — シングル、ダブル、または元のスタイルを保持し、安全なエスケープ処理を適用します。
- セミコロンのポリシー — 常に挿入、すべてを削除、または既存のものに従います。
- ブレースのスタイル — 1TBS(同じ行)またはAllman(次の行)。
- 終端カンマ — 無し、ES5(オブジェクトおよび配列のみ)、またはすべて(関数引数を含む)。
- 印刷幅の折り返し — 長いリテラルは複数行にわたって折り返されます。
- 現代的な構文 — 関数アロー、async/await、スプレッド/レスト、デストラクティング、クラス、テンプレートリテラル、BigInt、および正規表現リテラルがすべて認識されます。
- コメントの保持 — インラインおよびブロックコメントはフォーマットプロセスを通過します。
- ローカル実行 — あなたのコードはブラウザに残りません。
このツールを使用するタイミング
ミニフィードされたバンドルや第三者のスニペットを読むとき、チャットやメールからコードをプロジェクトにコピーするとき、チームメイトのスタイルを標準化してプルリクエストをレビューするとき、このフォーマッターを使いましょう。フルリントと異なり、このフォーマッターはスペースとピリオドにのみ焦点を当てており、論理はそのままです。
よくある質問
-
JavaScriptのミニフィアとフォーマッターの違いは何ですか?
ミニフィアは不要なスペースを削除し、識別子を短縮し、コメントを削除して、ブラウザに送るための最も小さなコードを生成します。フォーマッターまたはフォーマットは逆に、一貫したインデント、改行、スペースを追加して人間が読めるようにします。これらは通常、開発中のフォーマットとデプロイ前のミニフィアの両端に使われます。
-
決定論的なフォーマットがAIによるコードの再フォーマットよりも良い理由は何ですか?
決定論的なフォーマッターは同じ入力に対して常に同じルールを適用し、関数が今日と来月に再フォーマットされても、同じ差分が得られます。AIモデルは、微妙なスタイルのズレを引き起こす可能性があり、場合によっては論理を書き換えたり、存在しないオプションを発明したりします。バージョン管理に含まれるコードでは、予測可能な出力により差分がレビュー可能になり、誤った動作変更を回避できます。
-
1TBSブレーススタイルとAllmanの違いは何ですか?
1TBS — One True Brace Style — は、導入する文と同じ行に開きブレースを配置します。例えば
function foo() {。Allmanスタイルは開きブレースをその行の下に独自の行に配置します。どちらも有効ですが、1TBSは現代JavaScriptの主要な慣習であり、Prettierおよび多くのESLintのプリセットが採用しています。 -
JavaScriptでトレーリングコマを使うべきタイミングはいつですか?
マルチライン配列およびオブジェクトリテラルにおけるトレーリングコマは、すべての現代JavaScript実行環境で有効であり、アイテムを追加する際に、以前はコマと新しいアイテムの両方が必要だった行が、今ではコマのみで変更されるため、より短く、クリーンな差分を生成します。関数パラメータおよび引数リストにおけるトレーリングコマもES2017以降で有効ですが、古いツールとの互換性のために時々無効にされています。ES5モードを使用して、オブジェクトおよび配列にコマを含めたいが、関数呼び出しには含めたくない場合があります。
恵 スコアボードが到着しました!
スコアボード ゲームを追跡する楽しい方法です。すべてのデータはブラウザに保存されます。さらに多くの機能がまもなく登場します!
