Microsoft to React developers: Give TypeScript a try

Version 1.6 of the JavaScript subset forges links with Facebook's React UI technology and features an upgraded type system

Microsoft to React developers: Give TypeScript a try
Credit: Thinkstock

Microsoft has upgraded its TypeScript language yet again, this time featuring support for the React/JSX JavaScript syntax extension, linking TypeScript and Facebook's React UI technology.

A superset of JavaScript, TypeScript 1.6 also backs class expressions, new type system capabilities, and stricter type checking for object literals, according to a blog post this week by Microsoft's Jonathan Turner. But Microsoft's intent with TypeScript 1.6 was to allow React developers to leverage TypeScript's gradual, optional type-checking system to enhance code understanding and surface coding errors early, a Microsoft representative said.

Developers with TypeScript 1.6 get support for React typing and JSX, and TypeScript code can coexist with JSX syntax in a single file via the new .tsx extension. "This allows React developers to intermingle HTML-like syntax with TypeScript code," Turner said. The goal was to make it feel natural to work with React/JSX and have TypeScript's type-checking and autocomplete capabilities. "This allows you a rich editing experience for working with React and JSX when using Visual, Visual Studio Code, and [the Sublime text editor]. "

TypeScript 1.6 arrives just a couple of months behind the 1.5 release, which focused on ECMAScript (ES) 6 compliance. Version 1.4, which also emphasized ES6, arrived eight months ago. The language compiles to plain JavaScript and has been slated for use in the upcoming 2.0 release of the AngularJS JavaScript framework.

"TypeScript is a fledgling language based on JavaScript that could be useful to build large-scale cross-platform applications. Its advantages include its compiler and static typing, which can help developers validate and read code compared to pure JavaScript," analyst Rob Sanfilippo, of Directions on Microsoft, said. "Tools for the language have been improving and features continue to arrive, so the language could gain momentum, especially among developers that work with open source offerings."

Version 1.6 enables developers to write class expressions as Microsoft continues to round out ES6 support, Turner said. "Similar to class declarations, class expressions allow you to create new classes.  Unlike class declarations, you can use class expressions wherever you use an expression.

Object literal strictness in the upgrade is intended to make object compatibility stricter to assist in catching a common class of bugs. "This change has already helped to find dozens (if not hundreds) of real-world bugs in early adopter code, "Turner said in an earlier blog post about the beta release of TypeScript 1.6. Strict object literal assignment checking is listed as a breaking change in the release

Type capabilities are improved in version 1.6. User-defined type guard functions allow developers to work not only with typeof and instanceof checks, but also with interfaces and do custom analysis. A new type operator, "&", called intersection, creates anonymous combinations of types.

Generic alias types in 1.6 provide expressive capability, Turner explained. "Leading up to TypeScript 1.6, type aliases were restricted to being simple aliases that shortened long type names.  Unfortunately, without being able to make these generic, they had limited use."

Abstract classes are featured as well. "Similar in some ways to interfaces, abstract classes give you a way of creating a base class, complete with default implementations, that you can build from with the intention of it never being used directly outside of the class hierarchy," said Turner. 

Module resolution has been improved, too. "We've changed module resolution when doing CommonJS output to work more closely to how Node does module resolution," Turner said. 

To comment on this article and other InfoWorld content, visit InfoWorld's LinkedIn page, Facebook page and Twitter stream.
From CIO: 8 Free Online Courses to Grow Your Tech Skills
Notice to our Readers
We're now using social media to take your comments and feedback. Learn more about this here.