JSDoc / TSDoc Generator
Generate JSDoc or TSDoc documentation comments from JavaScript and TypeScript function signatures. Paste a signature or use the manual form builder.
About This Tool
The JSDoc / TSDoc Generator is a free browser-based tool that creates documentation comment blocks from JavaScript and TypeScript function signatures. Paste a function, method, class, or interface declaration and the tool automatically parses the name, parameters (with types, defaults, and optionality), return type, and generic type parameters to produce a complete JSDoc or TSDoc block.
The generator supports two input modes. Parse mode accepts raw code
signatures — regular functions, arrow functions, const declarations, class
declarations, and interfaces. Manual mode provides a form where you enter
the function name, parameters, return type, and generics by hand, which is
useful when the signature is complex or when you want to document a function
that does not yet exist.
You can toggle between JSDoc style (with {type} annotations in braces) and
TSDoc style (which omits inline types because TypeScript already provides them).
Optional tags like @example, @throws, @since, and @author can be
included or excluded with checkboxes.
If you work with TypeScript type generation, try JSON to TypeScript to generate interfaces from JSON data. For schema validation code, the JSON to Zod converter is a natural companion. And if you need to minify your documented code for production, the Code Minifier strips comments and whitespace.
All processing runs entirely in your browser. No code, signatures, or documentation text is ever sent to any server. This tool is safe to use with proprietary codebases and internal APIs.
How to Use
- Choose Parse mode (default) to paste a function signature, or Manual mode to fill in a form.
- In Parse mode, paste a JavaScript or TypeScript function, arrow function, class, or interface signature into the input textarea.
- Select JSDoc or TSDoc style using the style toggle.
- Enable or disable optional tags (
@example,@throws,@since,@author) in the Options panel. - If you enabled
@since, enter the version number. If you enabled@author, enter the author name. - The generated documentation comment appears instantly in the output panel with syntax highlighting.
- Click Copy or press Ctrl+Shift+C to copy the comment to your clipboard. Paste it above your function in your code editor.
Popular JSDoc / TSDoc Examples
FAQ
What is the difference between JSDoc and TSDoc?
JSDoc includes type annotations in curly braces (e.g., @param {string} name) because vanilla JavaScript has no type system. TSDoc omits inline types because TypeScript provides them through the type system, so @param name is sufficient. TSDoc also uses @typeParam instead of @template for generic type parameters. This tool supports both styles with a single toggle.
Which function signature formats are supported?
The parser handles regular function declarations (function foo()), arrow functions (const foo = () => {}), async functions, exported functions, class declarations, interface declarations, method signatures, generic type parameters, rest parameters, optional parameters, default values, and destructured parameters. If the parser cannot handle a complex signature, use Manual mode.
Can I document classes and interfaces?
Yes. Paste a class or interface declaration and the tool generates the appropriate comment block. For classes, it creates a class-level comment. For interfaces, it generates an interface-level comment. You can also use Manual mode and select 'Class' or 'Interface' as the kind.
Does this tool execute my code?
No. The tool only parses the text of your signature using string manipulation and regular expressions. It does not eval() or execute any code. No AST parser or compiler is loaded. The parsing is purely syntactic.
Is my data safe?
Yes. All processing runs entirely in your browser using JavaScript. No code, function signatures, or generated documentation is ever sent to any server. You can verify this by checking the Network tab in your browser's developer tools while using the tool.
Can I add custom descriptions to parameters?
In Manual mode, each parameter has a Description field where you can type a custom description. In Parse mode, the generated comment uses 'TODO: describe parameter' placeholders that you should replace with real descriptions in your code editor.
Does it support React components?
Yes. You can paste React function component signatures like 'function MyComponent(props: { title: string; count: number }): JSX.Element' or 'const MyComponent: React.FC<Props> = ...' and the tool will generate appropriate documentation with @param tags for the props.
Related Tools
JSON to TypeScript
Generate TypeScript interfaces or type aliases from JSON with nested type inference.
JSON to Zod Schema
Convert JSON to Zod schema definitions with type inference, optional/nullable fields, and strict mode.
Code Minifier
Minify and beautify JavaScript, CSS, and HTML code with size comparison stats.
JSON to Go Struct
Convert JSON to Go struct definitions instantly. Generates idiomatic Go types with json tags and proper naming.
JSON to Python
Convert JSON to Python dataclasses or TypedDict. Generate type-safe Python code from any JSON structure.