TypeScript isJavaScript with syntax for types.
TypeScript is a strongly typed programming language that builds on JavaScript, giving you better tooling at any scale.
ts
constuser = {firstName :"Angela",lastName :"Davis",role :"Professor",}Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'.2339Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'.console .log (user .) name
ts
constuser = {firstName :"Angela",lastName :"Davis",role :"Professor",}Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'.2339Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'.console .log (user .) name
TypeScript 5.8 is now available
What is TypeScript?
JavaScript and More
TypeScript adds additional syntax to JavaScript to support atighter integration with your editor. Catch errors early in your editor.
A Result You Can Trust
TypeScript code converts to JavaScript, whichruns anywhere JavaScript runs: In a browser, on Node.js, Deno, Bun and in your apps.
Safety at Scale
TypeScript understands JavaScript and usestype inference to give you great tooling without additional code.
Adopt TypeScript Gradually
Apply types to your JavaScript project incrementally,each step improves editor support and improves your codebase.
Let's take this incorrect JavaScript code, and see howTypeScript can catch mistakes in your editor.
js
functioncompact (arr ) {if (orr .length >10)returnarr .trim (0,10)returnarr }
No editor warnings in JavaScript files
This code crashes at runtime!
JavaScript file
js
// @ts-checkfunctioncompact (arr ) {if (Cannot find name 'orr'.2304Cannot find name 'orr'.. orr length >10)returnarr .trim (0,10)returnarr }
Adding this to a JS file shows errors in your editor
the param is arr, not orr!
JavaScript with TS Check
js
// @ts-check/**@param{any[]}arr */functioncompact (arr ) {if (arr .length >10)returnProperty 'trim' does not exist on type 'any[]'.2339Property 'trim' does not exist on type 'any[]'.arr .(0,10) trim returnarr }
Using JSDoc to give type information
Now TS has found a bad call. Arrays have slice, not trim.
JavaScript with JSDoc
ts
functioncompact (arr :string[]) {if (arr .length >10)returnarr .slice (0,10)returnarr }
TypeScript adds natural syntax for providing types
TypeScript file
Describe Your Data
Describe the shape of objects and functions in your code.
Making it possible to seedocumentation and issues in your editor.
ts
interfaceAccount {id :numberdisplayName :stringversion :1}functionwelcome (user :Account ) {console .log (user .id )}
ts
typeResult ="pass" |"fail"functionverify (result :Result ) {if (result ==="pass") {console .log ("Passed")}else {console .log ("Failed")}}
TypeScript becomes JavaScript via the delete key.
ts
typeResult ="pass" |"fail"functionverify (result :Result ) {if (result ==="pass") {console .log ("Passed")}else {console .log ("Failed")}}
TypeScript file.
ts
typeResult ="pass" |"fail"functionverify (result :Result ) {if (result ==="pass") {console .log ("Passed")}else {console .log ("Failed")}}
Types are removed.
js
functionverify (result ) {if (result ==="pass") {console .log ("Passed")}else {console .log ("Failed")}}
JavaScript file.
TypeScript Testimonials
First, we were surprised by the number of small bugs we found when converting our code.
Second, we underestimated how powerful the editor integration is.
TypeScript was such a boon to our stability and sanity that we started using it for all new code within days of starting the conversion.
Felix Rieseberg at Slack covered the transition of their desktop app from JavaScript to TypeScript in their blog
ReadLoved by Developers
Voted2nd most loved programming language in theStack Overflow 2020 Developer survey
TypeScript wasused by 78% of the2020 State of JS respondents, with93% saying they would use it again.
TypeScript was given the award for“Most Adopted Technology” based on year-on-year growth.