JavaScript Formatter

What Does This Tool Do?

It re-indents and reformats JavaScript source code with consistent spacing, making minified or inconsistently-formatted code readable again - useful when debugging third-party scripts or cleaning up code from multiple contributors.

Why Use This Tool?

Reading unformatted or minified JavaScript is difficult - a formatter restores consistent indentation so you can actually follow the code's structure and logic.

How to Use It

1. Paste your JavaScript code.
2. Click Format.
3. Copy the reformatted, readable code.

Limitations

This handles standard JavaScript syntax formatting - it does not execute your code, so it can't catch runtime errors, only structural/syntax issues that prevent parsing.

Example

const api={get:async(url)=>{const r=await fetch(url);if(!r.ok)throw new Error(r.status);return r.json()}}

becomes:

const api = {
    get: async (url) => {
        const r = await fetch(url);
        if (!r.ok) throw new Error(r.status);
        return r.json()
    }
}

Useful For

• Debugging production issues in minified bundles. Browser dev tools also have a "pretty print" button ({}) in the Sources panel.
• Reviewing third-party scripts - analytics tags, widgets or browser extensions - to see what they actually do.
• Cleaning up snippets from Stack Overflow, chats or AI assistants before adding them to a project.

Readable Is Not the Same as Original

Formatting restores layout, not names. Minified code often has variables renamed to a, b and c; only a source map can bring back the original names. Also, formatted code from an unknown source is still unknown code - read it, but do not run it unless you trust it.

For projects, set up Prettier so formatting is automatic. Shrink code again with the JavaScript Minifier, or format other languages with the Code Beautifier.