What a JavaScript formatter does
A JavaScript formatter takes code that is hard to read, such as one long line or code with mixed indentation, and rewrites it with steady spacing, line breaks and indentation. The program does exactly the same thing before and after. Only the whitespace changes.
// Before
function add(a,b){if(a>b){return a-b}return a+b}
// After
function add(a, b) {
if (a > b) {
return a - b
}
return a + b
}How to use it
- Paste your code into the box. A short sample is loaded so you can see the result straight away.
- Pick an indent: 2 spaces, 4 spaces or a tab.
- Copy the result, or download it as a .js file.
The result updates as you type, so there is no need to press a button, although the Format code button is there if you prefer it.
Options
- Keep line breaks: when on, a line break that you wrote inside an expression, a call or a list is kept and indented. Turn it off to join those lines.
- Keep blank lines: keeps one blank line wherever you had one or more, which helps to separate groups of code.
- Expand objects: puts every property of an object literal on its own line.
- Quotes: keep your quotes, or change strings to single or double quotes. A string is left alone if changing it would need extra escaping.
- End with a new line: adds the final line break that most style guides and Git expect.
What it does not do
This is a formatter, not a parser or a linter. It does not add or remove semicolons, rename anything or wrap long lines at a fixed width. It checks only that brackets and quotes balance, and it warns you when they do not. JSX and TypeScript are not supported. For a whole project, use a tool such as Prettier in your editor or build, as described in the guide to JavaScript code formatting.
Private by design
Your code is processed in your browser and is never uploaded, so it is fine to paste work code here.
Need something different? Use the JavaScript beautifier for minified code, the JavaScript minifier to make code smaller, or pretty print to read code with line numbers and colors.