---
title: "TypeScript: JavaScript With Syntax For Types"
url: https://stacklist.com/card/120ad27c-5b94-4408-847c-66e3c1c19378
source_url: "https://www.typescriptlang.org"
stack: https://stacklist.com/c/technology/stack/23639acd-5044-4e1f-9c83-417668933ee7
summary: "TypeScript is a strongly typed programming language built on JavaScript that provides better tooling, editor support, and error detection at any scale. It adds syntax for types and type inference while maintaining compatibility with JavaScript, allowing developers to catch mistakes early and adopt types gradually in their projects."
tags: "typescript, javascript, type-safety, programming-language, static-typing, code-examples"
key_entities: "TypeScript (technology), JavaScript (technology), Node.js (technology), Deno (technology), Bun (technology), type-inference (concept), static-typing (concept), Angela Davis (person)"
classification: "reference"
content_hash: "sha256:495175616393cefa25a9f956252a9c58704e5a7472f4c303efa9d005331ef004"
acp_version: "0.2"
token_counts_approximate: 1215
visibility: public
agent_accessible: true
status: "final"
---

# TypeScript: JavaScript With Syntax For Types

TypeScript is JavaScript with syntax for types. TypeScript is a strongly typed programming language that builds on JavaScript, giving you better tooling at any scale. Try TypeScript Now Online or via npm Editor Checks Auto-complete Interfaces JSX ts const user = { firstName : "Angela" , lastName : "Davis" , role : "Professor" , } &nbsp; console . log ( user . name ) Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'. 2339 Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'. &nbsp; ts const user = { firstName : "Angela" , lastName : "Davis" , role : "Professor" , } &nbsp; console . log ( user . name ) Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'. 2339 Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'. &nbsp; TypeScript 7.0 is now available What is TypeScript? JavaScript and More TypeScript adds additional syntax to JavaScript to support a tighter integration with your editor . Catch errors early in your editor. A Result You Can Trust TypeScript code converts to JavaScript, which runs anywhere JavaScript runs : In a browser, on Node.js, Deno, Bun and in your apps. Safety at Scale TypeScript understands JavaScript and uses type inference to give you great tooling without additional code. Get Started Handbook Learn the language Playground Try in your browser Download Install TypeScript Adopt TypeScript Gradually Apply types to your JavaScript project incrementally, each step improves editor support and improves your codebase. Let&#x27;s take this incorrect JavaScript code, and see how TypeScript can catch mistakes in your editor . js function compact ( arr ) { if ( orr . length &gt; 10 ) return arr . trim ( 0 , 10 ) return arr } No editor warnings in JavaScript files This code crashes at runtime! JavaScript file js // @ts-check &nbsp; function compact ( arr ) { if ( orr . length &gt; 10 ) Cannot find name 'orr'. 2304 Cannot find name 'orr'. return arr . trim ( 0 , 10 ) return arr } Adding this to a JS file shows errors in your editor the param is arr, not orr! JavaScript with TS Check js // @ts-check &nbsp; /** @param {any[]} arr */ function compact ( arr ) { if ( arr . .length: number' >length &gt; 10 ) return arr . trim ( 0 , 10 ) Property 'trim' does not exist on type 'any[]'. 2339 Property 'trim' does not exist on type 'any[]'. return arr } Using JSDoc to give type information Now TS has found a bad call. Arrays have slice, not trim. JavaScript with JSDoc ts function compact ( arr : string []) { if ( arr . .length: number' >length &gt; 10 ) return arr . .slice(start?: number | undefined, end?: number | undefined): string[]' >slice ( 0 , 10 ) return arr } 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 see documentation and issues in your editor . ts interface Account { id : number displayName : string version : 1 } &nbsp; function welcome ( user : Account ) { console . log ( user . id ) } ts type Result = "pass" | "fail" &nbsp; function verify ( result : Result ) { if ( result === "pass" ) { console . log ( "Passed" ) } else { console . log ( "Failed" ) } } TypeScript becomes JavaScript via the delete key. ts type Result = "pass" | "fail" &nbsp; function verify ( result : Result ) { if ( result === "pass" ) { console . log ( "Passed" ) } else { console . log ( "Failed" ) } } &nbsp; TypeScript file . ts type Result = "pass" | "fail" &nbsp; function verify ( result : Result ) { if ( result === "pass" ) { console . log ( "Passed" ) } else { console . log ( "Failed" ) } } &nbsp; Types are removed . js &nbsp; &nbsp; function verify ( result ) { if ( result === "pass" ) { console . log ( "Passed" ) } else { console . log ( "Failed" ) } } &nbsp; 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 Read Open Source with TypeScript Angular Vue Jest Redux Ionic Probot Deno Vercel Yarn GitHub Desktop Loved by Developers Voted 2nd most loved programming language in the Stack Overflow 2020 Developer survey TypeScript was used by 78% of the 2020 State of JS respondents, with 93% saying they would use it again . TypeScript was given the award for “Most Adopted Technology” based on year-on-year growth. Get Started Handbook Learn the language Playground Try in your browser Download Install TypeScript
