News

TypeScript Continues Embrace of React Native

• By David Ramel
• February 9, 2017

TypeScript 2.2 is out in a release candidate that continues its embrace of React Native, another JavaScript variant that's used to create native iOS and Android apps.

TypeScript, an open source technology championed by Microsoft, is a superset of JavaScript that incorporates object-oriented programming concepts such as static types and classes and compiles that code to clean JavaScript.

It's an example of how standard JavaScript has been put to new, modern uses, along with React Native, another open source project that Facebook developed by taking its React Web technology and transforming it for mobile app programming. React Native incorporates JSX, a syntax extension to JavaScript that provides a preprocessor step to add XML constructs to JavaScript.

TypeScript began supporting JSX back in September 2015 in version 1.6. "Our goal was to make it feel natural to work with React/JSX and to have all the type-checking and autocomplete capabilities of TypeScript," Microsoft said at the time. "This allows you a rich editing experience for working with React and JSX when using VS, VS Code, and Sublime."

Since then, JSX support has been steadily expanded, and the TypeScript 2.2 RC adds yet more JSX functionality in the form of a new way to emit JSX code.

Here's Microsoft's description of that new emit mode, as presented in a blog post:

In TypeScript 2.1 and earlier, the --jsx flag could take on two values:

• preserve which leaves JSX syntax alone and generates .jsx files.
• react which transforms JSX into calls to React.createElement and generates .js files.

TypeScript 2.2 has a new JSX emit mode called react-native which sits somewhere in the middle. Under this scheme, JSX syntax is left alone, but generates .js files.

This new mode accomodates React Native's loader which expects all input files to be .js files. It also satisfies cases where you want to just leave your JSX syntax alone but get .js files out from TypeScript.

Another new feature in TypeScript. 2.2 is the introduction of an object primitive type (as opposed to a capitalized Object that has a whole different meaning). It provides more flexibility in supplying values for certain APIs, such as in the Object.create() method, which requires a non-primitive first argument. Microsoft said it will help catch more bugs "and more accurately model real world code."

Yet another new feature in v2.2 highlighted in Microsoft's blog post is improved support for mixins and composable classes. Those and other features that weren't mentioned in the blog post can be seen in the TypeScript Roadmap. It shows TypeScript 2.3, due in May, will continue to expand support for React Native/JSX by providing "better support for literal types in JSX attributes."

JavaScript jockeys can experiment with the TypeScript 2.2 release candidate via NuGet or an npm install -g typescript@rc command.

"You can also get the TypeScript release candidate for Visual Studio 2015 (if you have Update 3)," Microsoft said. "Other built-in editor support will be coming with our proper 2.2 release, but you can look at guides on how to enable newer versions of TypeScript in Visual Studio Code and Sublime Text 3."