TypeScript is a free and open-source high-level programming language developed by Microsoft that adds static typing with optional type annotations to JavaScript. It is designed for the development of large applications and transpiles to JavaScript.[6] Because TypeScript is a superset of JavaScript, all JavaScript programs are syntactically valid TypeScript, but they can fail to type-check for safety reasons.
TypeScript may be used to develop JavaScript applications for both client-side and server-side execution (as with Node.js, Deno or Bun). Multiple options are available for transpilation. The default TypeScript Compiler can be used,[7] or the Babel compiler can be invoked to convert TypeScript to JavaScript.
TypeScript supports definition files that can contain type information of existing JavaScript libraries, much like C++ header files can describe the structure of existing object files. This enables other programs to use the values defined in the files as if they were statically typed TypeScript entities. There are third-party header files for popular libraries such as jQuery, MongoDB, and D3.js. TypeScript headers for the Node.js library modules are also available, allowing development of Node.js programs within TypeScript.[8]
The TypeScript compiler is itself written in TypeScript and compiled to JavaScript. It is licensed under the Apache License 2.0. Anders Hejlsberg, lead architect of C# and creator of Delphi and Turbo Pascal, has worked on the development of TypeScript.[9][10][11][12]
History
TypeScript was released to the public in October 2012, with version 0.8, after two years of internal development at Microsoft.[13][14] Soon after the initial public release, Miguel de Icaza praised the language itself, but criticized the lack of mature IDE support apart from Microsoft Visual Studio, which was not available on Linux and macOS at the time.[15][16] As of April 2021 there is support in other IDEs and text editors, including Emacs, Vim, WebStorm, Atom[17] and Microsoft's own Visual Studio Code.[18] TypeScript 0.9, released in 2013, added support for generics.[19]
TypeScript 1.0 was released at Microsoft's Build developer conference in 2014.[20] Visual Studio 2013 Update 2 provided built-in support for TypeScript.[21] Further improvement were made in July 2014, when the development team announced a new TypeScript compiler, asserted to have a five-fold performance increase. Simultaneously, the source code, which was initially hosted on CodePlex, was moved to GitHub.[22]
On 22 September 2016, TypeScript 2.0 was released, introducing several features, including the ability for programmers to optionally enforce null safety,[23] to mitigate what's sometimes referred to as the billion-dollar mistake.
TypeScript 3.0 was released on 30 July 2018,[24] bringing many language additions like tuples in rest parameters and spread expressions, rest parameters with tuple types, generic rest parameters and so on.[25]
TypeScript 4.0 was released on 20 August 2020.[26] While 4.0 did not introduce any breaking changes, it added language features such as Custom JSX Factories and Variadic Tuple Types.[26]
TypeScript 5.0 was released on 16 March 2023 and included support for decorators.[27]
Design
TypeScript originated from the shortcomings of JavaScript for the development of large-scale applications both at Microsoft and among their external customers.[28] Challenges with dealing with complex JavaScript code led to demand for custom tooling to ease developing of components in the language.[29]
Developers sought a solution that would not break compatibility with the ECMAScript standard and its ecosystem, so a compiler was developed to transform a superset of JavaScript with type annotations and classes (TypeScript files) back into vanilla ECMAScript 5 code. TypeScript classes were based on the then-proposed ECMAScript 6 class specification to make writing prototypal inheritance less verbose and error-prone, and type annotations enabled IntelliSense and improved tooling.
Features
TypeScript adds the following syntax extensions to JavaScript:
- Type annotations and compile-time type checking
- Type inference
- Interfaces
- Enumerated types
- Generics
- Namespaces
- Tuples
- Explicit Resource Management[30]
Syntactically, TypeScript is very similar to JScript .NET, another Microsoft implementation of the ECMA-262 language standard that added support for static typing and classical object-oriented language features such as classes, inheritance, interfaces, and namespaces. Other inspirations include Java and C#.
Type annotations
TypeScript provides static typing through type annotations to enable type checking at compile time.
function add(left: number, right: number): number {
return left + right;
}
Primitive types are annotated using all-lowercase types, such as number
, boolean
, bigint
, and string
. These types are distinct from their boxed counterparts (Number
, Boolean
, etc), which cannot have operations performed from values directly (a Number
and number
cannot be added). There are additionally undefined
and null
types for their respective values.
All other non-primitive types are annotated using their class name, such as Error
. Arrays can be written in two different ways which are both syntactically the same: the generic-based syntax Array<T>
and a shorthand with T[]
.
Additional built-in data types are tuples, unions, never
and any
:
- An array with predefined data types at each index is a tuple, represented as
[type1, type2, ..., typeN]
. - A variable that can hold more than one type of data is a union, represented using the logical OR
|
symbol (string | number
). - The
never
type is used when a given type should be impossible to create, which is useful for filtering mapped types. - A value of type
any
supports the same operations as a value in JavaScript and minimal static type checking is performed,[31] which makes it suitable for weakly or dynamically-typed structures. This is generally discouraged practice and should be avoided when possible.[32]
Type annotations can be exported to a separate declarations file to make type information available for TypeScript scripts using types already compiled into JavaScript. Annotations can be declared for an existing JavaScript library, as has been done for Node.js and jQuery.
The TypeScript compiler makes use of type inference when types are not given. For example, the add
method in the code above would be inferred as returning a number
even if no return type annotation had been provided. This is based on the static types of left
and right
being number
s, and the compiler's knowledge that the result of adding two number
s is always a number
.
If no type can be inferred because of lack of declarations (such as in a JavaScript module without types), then it defaults to the dynamic any
type. Additional module types can be provided using a .d.ts declaration file using the declare module "moduleName"
syntax.
Declaration files
When a TypeScript script gets compiled, there is an option to generate a declaration file (with the extension .d.ts
) that functions as an interface to the components in the compiled JavaScript. In the process, the compiler strips away all function and method bodies and preserves only the signatures of the types that are exported. The resulting declaration file can then be used to describe the exported virtual TypeScript types of a JavaScript library or module when a third-party developer consumes it from TypeScript.
The concept of declaration files is analogous to the concept of header files found in C/C++.
declare namespace Arithmetics {
add(left: number, right: number): number;
subtract(left: number, right: number): number;
multiply(left: number, right: number): number;
divide(left: number, right: number): number;
}
Type declaration files can be written by hand for existing JavaScript libraries, as has been done for jQuery and Node.js.
Large collections of declaration files for popular JavaScript libraries are hosted on GitHub in DefinitelyTyped.
Generics
TypeScript supports generic programming using a syntax similar to Java.[33] The following is an example of the identity function.[34]
function id<T>(x: T): T {
return x;
}
Classes
TypeScript uses the same annotation style for class methods and fields as for functions and variables respectively. Compared with vanilla JavaScript classes, a TypeScript class can also implement an interface through the implements
keyword, use generic parameters similarly to Java, and specify public and private fields.
class Person {
public name: string;
private age: number;
private salary: number;
constructor(name: string, age: number, salary: number) {
this.name = name;
this.age = age;
this.salary = salary;
}
toString(): string {
return `${this.name} (${this.age}) (${this.salary})`;
}
}
Union types
Union types are supported in TypeScript.[35] The values are implicitly "tagged" with a type by the language, and may be retrieved using a typeof
call for primitive values and an instanceof
comparison for complex data types. Types with overlapping usage (e.g. a slice method exists on both strings and arrays, the plus operator works on both strings and numbers) don't need additional narrowing to use these features.
function successor(n: number | bigint): number | bigint {
// types that support the same operations don't need narrowing
return ++n;
}
function dependsOnParameter(v: string | Array<string> | number) {
// distinct types need narrowing
if (v instanceof Array) {
// do something
} else if (typeof(v) === "string") {
// do something else
} else {
// has to be a number
}
}
Enumerated types
TypeScript adds an 'enum' data type to JavaScript.
enum Cardsuit {Clubs, Diamonds, Hearts, Spades};
var c: Cardsuit = Cardsuit.Diamonds;
By default, enums number members starting at 0; this can be overridden by setting the value of the first:
enum Cardsuit {Clubs = 1, Diamonds, Hearts, Spades};
var c: Cardsuit = Cardsuit.Diamonds;
All the values can be set:
enum Cardsuit {Clubs = 1, Diamonds = 2, Hearts = 4, Spades = 8};
var c: Cardsuit = Cardsuit.Diamonds;
TypeScript supports mapping the numeric value to its name. For example, this finds the name of the value 2:
enum Cardsuit {Clubs = 1, Diamonds, Hearts, Spades};
var suitName: string = Cardsuit[2];
alert(suitName);
Modules and namespaces
TypeScript distinguishes between modules and namespaces. Both features in TypeScript support encapsulation of classes, interfaces, functions and variables into containers. Namespaces (formerly internal modules) utilize JavaScript immediately-invoked function expressions to encapsulate code, whereas modules (formerly external modules) use existing JavaScript library patterns (CommonJS or ES Modules).[36]
Compatibility with JavaScript
As TypeScript is simply a superset of JavaScript, existing JavaScript can be quickly adapted to TypeScript and TypeScript program can seamlessly consume JavaScript. The compiler can target all ECMAScript versions versions 5 and above, transpiling modern features like classes and arrow functions to their older counterparts.
With TypeScript, it is possible to use existing JavaScript code, incorporate popular JavaScript libraries, and call TypeScript-generated code from other JavaScript.[37] Type declarations for these libraries are usually provided with the source code but can be declared or installed separately if needed.
Development tools
Compiler
The TypeScript compiler, named tsc
, is written in TypeScript. As a result, it can be compiled into regular JavaScript and can then be executed in any JavaScript engine (e.g. a browser). The compiler package comes bundled with a script host that can execute the compiler. It is also available as a Node.js package that uses Node.js as a host.
The compiler can "target" a particular edition of ECMAScript (such as ES5 for legacy browser compatibility), but by default compiles for the latest standards.
IDE and editor support
- Microsoft provides a plug-in for Visual Studio 2012 and WebMatrix, full integrated support in Visual Studio 2013, Visual Studio 2015, and basic text editor support for Emacs and Vim.[38]
- Visual Studio Code supports TypeScript in addition to several other languages, and offers features like debugging and intelligent code completion.
- alm.tools is an open source cloud IDE for TypeScript built using TypeScript, ReactJS and TypeStyle.
- JetBrains supports TypeScript with code completion, refactoring and debugging in its IDEs built on IntelliJ platform, such as PhpStorm 6, WebStorm 6, and IntelliJ IDEA,[39] as well as their Visual Studio Add-in and extension, ReSharper 8.1.[40][41]
- Atom has a TypeScript plugin with support for code completion, navigation, formatting, and fast compilation.[42]
- The online Cloud9 IDE and Codenvy support TypeScript.
- A plugin is available for the NetBeans IDE.
- A plugin is available for the Eclipse IDE (version Kepler)
- TypEcs is available for the Eclipse IDE.
- The Cross Platform Cloud IDE Codeanywhere supports TypeScript.
- Webclipse An Eclipse plugin designed to develop TypeScript and Angular 2.
- Angular IDE A standalone IDE available via npm to develop TypeScript and Angular 2 applications, with integrated terminal support.
- Tide – TypeScript Interactive Development Environment for Emacs.
Integration with build automation tools
Using plug-ins, TypeScript can be integrated with build automation tools, including Grunt (grunt-ts[43]), Apache Maven (TypeScript Maven Plugin[44]), Gulp (gulp-typescript[45]) and Gradle (TypeScript Gradle Plugin[46]).
Linting tools
TSLint[47] scans TypeScript code for conformance to a set of standards and guidelines. ESLint, a standard JavaScript linter, also provided some support for TypeScript via community plugins. However, ESLint's inability to leverage TypeScript's language services precluded certain forms of semantic linting and program-wide analysis.[48] In early 2019, the TSLint team announced the linter's deprecation in favor of typescript-eslint
, a joint effort of the TSLint, ESLint and TypeScript teams to consolidate linting under the ESLint umbrella for improved performance, community unity and developer accessibility.[49]
CodeDOM Provider
CodeDOM[50] provides types that represent common types of source code elements, which will be transformed to data types, classes and statements etc. of a programming language through a CodeDOMProvider.[51] Programmers use CodeDOM and a CodeDOM provider to construct a code generator that generates codes for an application domain. TypeScript CodeDOM Provider[52] generates TypeScript codes according to a CodeDOM.
Release history
See also
References
Citations
- ^ "TypeScript". CodePlex. Archived from the original on 3 April 2015. Retrieved 26 April 2015.
- ^ "Release 5.6.3". 9 October 2024. Retrieved 27 October 2024.
- ^ "Type Compatibility". TypeScript. Archived from the original on 12 March 2018. Retrieved 21 March 2018.
- ^ "The Early History of F#" (PDF). Archived (PDF) from the original on 9 August 2024. Retrieved 5 February 2024.
TypeScript was directly influenced by F#: one of the originators of TypeScript was Luke Hoban, who began TypeScript (then called Strada) immediately after working on F# 2.0. Recently he noted the influence of F# on early parts of the TypeScript design [Hoban 2017].
- ^ Nelson, Gary (28 April 2020). "How ActionScript foreshadowed TypeScript". Medium. Archived from the original on 9 August 2024. Retrieved 9 July 2022.
- ^ Bright, Peter (3 October 2012). "Microsoft TypeScript: the JavaScript we need, or a solution looking for a problem?". Ars Technica. Condé Nast. Archived from the original on 9 October 2018. Retrieved 26 April 2015.
- ^ "TypeScript Programming with Visual Studio Code". code.visualstudio.com. Archived from the original on 22 September 2022. Retrieved 12 February 2019.
- ^ "borisyankov/DefinitelyTyped". GitHub. Archived from the original on 1 November 2015. Retrieved 26 April 2015.
- ^ Foley, Mary Jo (1 October 2012). "Microsoft takes the wraps off TypeScript, a superset of JavaScript". ZDNet. CBS Interactive. Archived from the original on 13 November 2014. Retrieved 26 April 2015.
- ^ Somasegar, S. (1 October 2012). "Somasegar's blog". Microsoft. Archived from the original on 22 April 2015. Retrieved 26 April 2015.
- ^ Baxter-Reynolds, Matt (1 October 2012). "Microsoft TypeScript: Can the father of C# save us from the tyranny of JavaScript?". ZDNet. Archived from the original on 3 August 2014. Retrieved 26 April 2015.
- ^ Jackson, Joab (1 October 2012). "Microsoft Augments Javascript for Large-scale Development". CIO. IDG Enterprise. Archived from the original on 17 December 2013. Retrieved 26 April 2015.
- ^ "Microsoft augments JavaScript for large-scale development". InfoWorld. IDG. 1 October 2012. Archived from the original on 31 May 2013. Retrieved 26 April 2015.
- ^ Turner, Jonathan (2 April 2014). "Announcing TypeScript 1.0". TypeScript Language team blog. Microsoft. Archived from the original on 5 September 2015. Retrieved 20 October 2021.
- ^ Miguel de Icaza (1 October 2012). "TypeScript: First Impressions". Archived from the original on 24 February 2019. Retrieved 12 October 2012.
But TypeScript only delivers half of the value in using a strongly typed language to Unix developers: strong typing. Intellisense, code completion and refactoring are tools that are only available to Visual Studio Professional users on Windows. There is no Eclipse, MonoDevelop or Emacs support for any of the language features
- ^ "Microsoft TypeScript: Can the father of C# save us from the tyranny of JavaScript?". ZDNet. 1 October 2012. Archived from the original on 3 August 2014. Retrieved 12 October 2012.
And I think this is a pretty big misstep. If you're building web apps that run on anything other than Windows, you're likely using a Mac and most likely not using Visual Studio. You need the Visual Studio plug-in to get the IntelliSense. All you get without Visual Studio is the strong-typing. You don't get the productivity benefits you get from IntelliSense..
- ^ "TypeStrong: The only TypeScript package you will ever need". GitHub. Archived from the original on 19 December 2018. Retrieved 21 July 2016.
- ^ Hillar, Gastón (14 May 2013). "Working with TypeScript in Visual Studio 2012". Dr. Dobb's Journal. Archived from the original on 29 September 2018. Retrieved 26 April 2015.
- ^ "TypeScript 0.9 arrives with new compiler, support for generics". The Register. 18 June 2013. Archived from the original on 11 March 2018. Retrieved 26 April 2015.
- ^ Hejlsberg, Anders (2 April 2014). "TypeScript". Channel 9. Microsoft. Archived from the original on 25 May 2015. Retrieved 26 April 2015.
- ^ Jackson, Joab (25 February 2014). "Microsoft TypeScript graduates to Visual Studio". PC World. IDG. Archived from the original on 11 March 2016. Retrieved 26 April 2015.
- ^ Turner, Jonathan (21 July 2014). "New Compiler and Moving to GitHub". TypeScript Language team blog. Microsoft. Archived from the original on 22 July 2014. Retrieved 26 April 2015.
- ^ Bright, Peter (22 September 2016). "TypeScript, Microsoft's JavaScript for big applications, reaches version 2.0". Ars Technica. Condé Nast. Archived from the original on 21 December 2018. Retrieved 22 September 2016.
- ^ "Announcing TypeScript 3.0". 30 July 2018. Archived from the original on 30 May 2020. Retrieved 16 March 2020.
- ^ "TypeScript 3.0". 30 July 2018. Archived from the original on 6 June 2020. Retrieved 16 March 2020.
- ^ a b "Announcing TypeScript 4.0". TypeScript. 20 August 2020. Archived from the original on 9 August 2024. Retrieved 30 October 2020.
- ^ "Documentation – TypeScript 5.0". www.typescriptlang.org. Archived from the original on 9 August 2024. Retrieved 18 May 2023.
- ^ Anders Hejlsberg (5 October 2012). "What is TypeScript and why with Anders Hejlsberg". www.hanselminutes.com. Archived from the original on 27 December 2018. Retrieved 15 January 2014.
- ^ S. Somasegar (1 October 2012). "TypeScript: JavaScript Development at Application Scale". msdn.com. Archived from the original on 22 April 2015. Retrieved 27 November 2013.
- ^ "Documentation – TypeScript 5.2". www.typescriptlang.org. Archived from the original on 9 August 2024. Retrieved 9 November 2023.
- ^ "TypeScript Language Specification p.24" (PDF). Archived from the original (PDF) on 17 November 2013.
- ^ "TypeScript: Documentation – Everyday Types". www.typescriptlang.org/. Archived from the original on 9 August 2024. Retrieved 30 March 2021.
- ^ Turner, Jonathan (18 June 2013). "Announcing TypeScript 0.9". TypeScript Language team blog. Microsoft. Archived from the original on 26 November 2013. Retrieved 18 June 2013.
- ^ "Generics in Typescript". Microsoft. Archived from the original on 5 April 2020. Retrieved 8 April 2020.
- ^ "Handbook - Unions and Intersection Types". www.typescriptlang.org. Retrieved 30 November 2020.
- ^ Sönke Sothmann (31 January 2014). "An introduction to TypeScript's module system". blog.oio.de. Archived from the original on 1 February 2014. Retrieved 21 February 2014.
- ^ "Welcome to TypeScript". typescriptlang.org. Microsoft. Archived from the original on 10 March 2018. Retrieved 26 April 2015.
- ^ Olivier Bloch (1 October 2012). "Sublime Text, Vi, Emacs: TypeScript enabled!". Microsoft. Archived from the original on 29 October 2012. Retrieved 28 October 2012.
- ^ "TypeScript support in WebStorm 6". JetBrains. Archived from the original on 2 June 2016. Retrieved 20 April 2013.
- ^ "TypeScript support in ReSharper 8.1". JetBrains. 28 October 2013. Archived from the original on 2 February 2014. Retrieved 21 January 2014.
- ^ "ReSharper: The Visual Studio Extension for .NET Developers by JetBrains". JetBrains.
- ^ "atom-typescript". Atom. Archived from the original on 4 October 2016. Retrieved 9 January 2020.
- ^ "TypeStrong/grunt-ts". GitHub. Archived from the original on 16 April 2020. Retrieved 26 April 2015.
- ^ "ppedregal/typescript-maven-plugin". GitHub. Archived from the original on 11 June 2018. Retrieved 26 April 2015.
- ^ "ivogabe/gulp-typescript". GitHub. Archived from the original on 11 June 2018. Retrieved 14 July 2017.
- ^ "sothmann/typescript-gradle-plugin". GitHub. Archived from the original on 11 June 2018. Retrieved 26 April 2015.
- ^ "TSLint". palantir.github.io. Archived from the original on 21 December 2022. Retrieved 11 February 2019.
- ^ Palantir (19 February 2019). "TSLint in 2019". Medium. Retrieved 24 April 2019.
- ^ "TSLint Deprecated to Focus Support on typescript-eslint". InfoQ. Archived from the original on 9 August 2024. Retrieved 24 April 2019.
- ^ "CodeDOM". learn.microsoft.com.
- ^ "CodeDOMProvider". learn.microsoft.com. Archived from the original on 9 August 2024. Retrieved 8 December 2023.
- ^ "TypeScript CodeDOM Provider". github.com. Archived from the original on 9 August 2024. Retrieved 26 February 2024.
Sources
- "Webclipse : Eclipse Plugin" Archived 16 December 2016 at the Wayback Machine Genuitec. Retrieved 9 November 2016.
- "Angular IDE by Webclipse : Standalone IDE" Archived 10 November 2016 at the Wayback Machine Genuitec. Retrieved 9 November 2016.