JavaScriptの構文フォーマットとは？

JavaScriptのフォーマットとは、ソースコードが有効かどうかを確認したうえで、統一されたスタイルに整形するプロセスです。通常は、コードの意味を変えずにインデント、空白、改行を調整します。

構文の検証も同様に重要です。フォーマッターがコードを安全に書き換えられるのは、まずパーサーがコードを理解できる場合に限られます。

ツールの説明

このツールはブラウザー上でJavaScriptの構文を検証し、コードをフォーマットします。パーサーを使用して入力内容が有効かどうかを確認し、Prettierを使用して同じソースをより読みやすい形式に整えます。

完全なIDEを開かずに、手早くフォーマットしたり構文をチェックしたりしたい場合に便利です。

例

  • インポートとエクスポートを含む小規模なESモジュール
  • ReactコンポーネントなどのJSXスニペット
  • インデントの整理が必要な長いオブジェクトリテラル

特徴

  • Babelパーサーによる構文検証
  • Prettier standaloneによるフォーマット
  • すばやくリセットできるクリアボタンの操作

制限事項

このツールは構文のみを対象とします。コードを実行することはできず、TypeScriptの入力には対応していません。

検証とフォーマットのどちらでも空の入力は受け付けられないため、いずれかの操作を使用する前に実際のコードを入力する必要があります。