JS to TypeScript Converter — Free Auto Type Annotations
Convert JavaScript to TypeScript with auto-inferred types, JSDoc-to-types upgrades, and strict-mode hints. Free, browser-only.
About JavaScript to TypeScript Converter
A JS-to-TypeScript converter takes plain JavaScript code and rewrites it as TypeScript by adding type annotations — function parameter types, return types, variable types, JSDoc → TS type upgrades, and basic generic inference. Useful for incremental migration of legacy JS codebases to TS, learning TS by seeing how JS maps to typed equivalents, and one-off file conversions. The ZTools JS to TypeScript Converter uses TypeScript's own compiler API for inference, plus heuristics for tricky cases (callbacks, untyped object literals). Output isn't production-ready without review — manual type tightening is always required, but the converter saves 60–80% of the typing effort.
Use cases
- Legacy JS → TS migration. A 10k-line JS codebase needs migration. Run files through the converter; review and tighten output. Saves weeks.
- Learning TypeScript. Paste familiar JS, see what TS would look like. Learn types by seeing them applied to your own code instead of contrived examples.
- Sharing snippets in TS-only environments. StackOverflow / blog post requires TS; you wrote in JS. Quick convert + manual polish.
- JSDoc → real types. Existing code has rich JSDoc. Tool converts `@param {string} name` to `name: string`. Native TS is more reliable for tooling.
How it works
- Paste JS. ES6+ syntax. CommonJS, ES modules, browser globals all handled.
- Set strictness. Lenient (any where unclear) or strict (force explicit types).
- Convert. TypeScript compiler infers types from usage. JSDoc annotations promoted to TS types.
- Review. Output highlights inferred-as-any locations + suggests tightening. NEVER ship without manual review.
- Copy / download. .ts file ready for `tsc` compile.
Examples
Input: `function add(a, b) { return a + b; }`
Output: `function add(a: number, b: number): number { return a + b; }` — types inferred from + operator usage.
Input: `const fetchUser = async (id) => { ... }` with JSDoc `@param {string} id`
Output: `const fetchUser = async (id: string): Promise<User> => { ... }` (with User interface inferred from return).
Input: JS callback `arr.map(x => x * 2)`
Output: TS: `arr.map((x: number): number => x * 2)` — types pulled from arr type.
Frequently asked questions
Will it convert any JS?
Most. Edge cases: dynamic typeof patterns, runtime-built objects, prototype manipulation may need manual types. Plain functional code converts cleanly.
Is the output production-ready?
No — manual review is mandatory. Inferred types may be too loose (e.g. `any[]` where `User[]` is correct). Treat output as "85% of the way there".
JSDoc vs new TS types — which wins?
JSDoc upgraded to TS types. If both exist (rare), TS wins.
Will it preserve comments?
Yes — non-JSDoc comments preserved verbatim. JSDoc may be removed if its info is now redundant with the TS type.
Generics?
Some inferred for obvious cases (`function identity<T>(x: T): T { return x; }`). Most generics need manual annotation.
React JSX → TSX?
Tool handles JSX → TSX conversion + adds prop types where it can infer.
Pro tips
- Always run `tsc --strict` after conversion — catches loose types the tool missed.
- Tighten `any` to specific types in your review pass — that's where TS value comes from.
- For file-by-file migration, set `allowJs: true` in tsconfig so JS and TS files coexist.
- JSDoc-rich code converts much cleaner than untyped JS — invest in JSDoc before migrating.
- For React, consider migrating components last — types propagate from leaf to root.
Reviewed by Ahsan Mahmood · Last updated 2026-05-06 · Part of ZTools.
For the full,
formatted version of this page, please enable JavaScript and reload
https://ztools.zaions.com/js-to-typescript.