TypeScript and the Power of a Statically-Typed Language

If there is a secret to the success of TypeScript, it is in the type checking, ensuring that the data flowing through the program is of the correct kind of data. Type checking cuts down on errors, sets the stage for better tooling, and allows developers to map their programs at a higher level. And TypeScript itself, a statically-typed superset of JavaScript, ensures that an army of JavaScript programmers can easily enjoy these advanced programming benefits with a minimal learning curve.

In this latest edition of The New Stack Makers podcast, we spoke with a few of TypeScript’s designers and maintainers to learn a bit more about the design of the language: Ryan Cavanaugh, a principal software engineering manager for Microsoft; Luke Hoban, chief technology officer for Pulumi, who was one of the original creators of TypeScript, and; Daniel Rosenwasser, senior program manager, Microsoft. TNS editors Darryl Taft and Joab Jackson hosted the discussion.

TypeScript and the Power of a Statically-Typed Language

TypeScript came about within Microsoft in 2012 as a way to help their  C++ or C# developers to write large-scale web applications, recalled Hoban, who was then part of the developer tools group at Microsoft.

The natural choice was to use JavaScript, the dominant language for the web. But JavaScript didn’t offer much tooling to help developers organize, assist and check their code writing. Various early solutions worked on by Microsoft and other web-scale companies were mostly efforts to compile traditional languages such as C++ into JavaScript, though this left developers at “an arm’s length from the platform,” Hoban said.

They wanted to develop a language that had the “ability to express types into the syntax as a lightweight extension to JavaScript, but …  still offer as much sort of inference as possible, so that you need to use those annotations sort of as infrequently as possible,” Hoban said.

The answer came in making a superset of JavaScript that would be fully compatible with JavaScript and can be transpiled into JavaScript for full browser compatibility. To add rigor, it came with additional type checking. But it would be a nuanced form of type checking that wasn’t too painful to the developer.

The developers of the project are proud of the flexibility that TypeScript offers. Simply mandating that the developer assign a previously-defined type to each variable would be overkill, they admitted. A developer may want to do something tricky, like create a function that makes identical copies of an object, but with the property names all in lower case. The type system had to support this complexity.

“We have a lot of expressivity in our type system,” Cavanaugh said. “We built up many constructs over time in the type system to the point where when you create a type, you’re actually kind of running it through a mini programming language within our type system.”

The development team hopes to have recently implemented recursive typing, where a custom type may be a set number of programming rules.

“We’re trying to enable the right patterns where you’re actually able to express what your JavaScript is doing at runtime. We don’t want people to go overboard, but we’re trying not to like get them stuck in some cases,” Cavanaugh said.

TypeScript now implements a control flow-based type analysis for local variables and parameters. For this, the design team conducted code flow analysis to better understand how data types were being used so TypeScript “just kind of automagically picks up how the types are flowing through your program, so you’re just really writing JavaScript at the end of the day,” Cavanaugh said. (Despite the benefits of type checking, it may be a while if it ever finds itself into JavaScript itself, our panelists agreed. Basic type checking would be easy enough for the browser, but the most complex evaluations would be difficult to implement in runtime. )

With TypeScript, developers are able to map out their programs at a much larger scale, in a way that makes sense to others joining the project later on. “So you’re starting to see much richer and more complex applications which would not have been possible otherwise,” Cavanaugh noted. TypeScript is used across Microsoft for most of all of its web applications, for instance. It is a favorite among JavaScript framework developers, including Angular.js. Slack used Typescript to build its desktop client. It is an integral part of Figma, a popular open source web design tool.

But it can also be used for smaller projects as well. Rosenwasser recalled writing a small script for a one-time project. Initially, he chose JavaScript so he didn’t have to go through the transpiler step. He got caught up trying to find an elusive bug, however. He ran the code through the TypeScript ts-check tool and immediately found the error.

The typing also helps with security. Built for a hostile web environment, JavaScript already has good built-in security, with built-in memory security and a bevy of runtime checks. Where Typescript helps is that it shows and prevents higher-level logic errors, especially those that can come from incorrectly handling input data.

“Data corruption can lead to a security problem. And making sure that you’re like always calling things the right way is just as part of that,” Cavanaugh said.