Home Programming Languages TypeScript 3.2 released with configuration inheritance and more

TypeScript 3.2 released with configuration inheritance and more

0
2827
TypeScript 3.7
6 min read

TypeScript 3.2 was released yesterday. It is a language that brings static type-checking to JavaScript which enables developers to catch issues even before the code is run. TypeScript 3.2 includes the latest JavaScript features from ECMAScript standard. In addition to type-checking, it provides tooling in editors to jump to variable definitions, find the user of a function, and automate refactorings.

You can install TypeScript 3.2 via NuGet or install via npm as follows:

Learn Programming & Development with a Packt Subscription
npm install -g typescript

Now let’s look at the new features in TypeScript 3.2.

strictBindCallApply

TypeScript 3.2 comes with stricter checking for bind, call, and apply.

In JavaScript, bind, call, and apply are methods on functions that allow actions like bind this and partially apply arguments. They also allow you to call functions with a different value for this, and call functions with an array for their arguments.

Earlier, TypeScript didn’t have the power to model these functions. Demand to model these patterns in a type-safe way led the TypeScript developers to revisit this problem. There were two features that opened up the right abstractions to accurately type bind, call, and apply without any hard-coding:

  • this parameter types from TypeScript 2.0
  • Modeling the parameter lists with tuple types from TypeScript 3.0

The combination of these two can ensure that the uses of bind, call, and apply are more strictly checked when we use a new flag called strictBindCallApply. When this new flag is used, the methods on callable objects are described by a new global type—CallableFunction. It declares stricter versions of the signatures for bind, call, and apply. Similarly, any methods on constructable (which are not callable) objects are described by a new global type called NewableFunction.

A caveat of this new functionality is that bind, call, and apply can’t yet fully model generic functions or functions having overloads.

Object spread on generic types

JavaScript has a handy way of copying existing properties from an existing object into a new object called “spreads”. To spread an existing object into a new object, an element with three consecutive periods (…) can be defined. TypeScript does well in this area when it has enough information about the type. But it wouldn’t work with generics at all until now.

A new concept in the type system called an “object spread type” could have been used. This would be a new type operator that looks like this: { …T, …U } to reflect the syntax of an object spread.

If T and U are known, that type would flatten to some new object type. This approach was complex and required adding new rules to type relationships and inference. After exploring several different avenues, two conclusions arrived:

  1. Users were fine modeling the behavior with intersection types for most uses of spreads in JavaScript. For example, Foo & Bar.
  2. Object.assign: This a function that exhibits most of the behavior of spreading objects. It is already modeled using intersection types. There has been very little negative feedback around that.

Intersections model the common cases and they’re relatively easy to reason about for both users and the type system. So now TypeScript 3.2 allows object spreads on generics and models them using intersections.

Object rest on generic types

Object rest patterns are kind of a dual to object spreads. It creates a new object that lacks some specified properties instead of creating a new object with some extra or overridden properties.

Configuration inheritance via node_modules packages

TypeScript has supported extending tsconfig.json files by using the extends field for a long time. This feature is useful to avoid duplicating configuration which can easily fall out of sync. It really works best when multiple projects are co-located in the same repository. This way each project can reference a common “base” tsconfig.json.

But some projects are written and published as fully independent packages. Such projects don’t have a common file they can reference. So as a workaround, users could create a separate package and reference that. TypeScript 3.2 resolves tsconfig.jsons from node_modules. TypeScript will dive into node_modules packages when a bare path for the “extends” field in tsconfig.json is used.

Diagnosing tsconfig.json with –showConfig

The TypeScript compiler, tsc, now supports a new flag called –showConfig. On running tsc –showConfig, TypeScript will calculate the effective tsconfig.json and print it out.

BigInt

BigInts are a part of an upcoming ECMAScript proposal that allow modeling theoretically arbitrarily large integers. TypeScript 3.2 comes with type-checking for BigInts along with support for emitting BigInt literals when targeting esnext. Support for BigInt in TypeScript introduces a new primitive type called bigint. BigInt support is only available for the esnext target.

Object.defineProperty declarations in JavaScript

When writing in JavaScript files using allowJs, TypeScript 3.2 recognizes declarations that use Object.defineProperty. This means better completions, and stronger type-checking when enabling type-checking in JavaScript files.

Improvements in error messages

A few things have been added in TypeScript 3.2 that will make the language easier to use.

  • Better missing property errors
  • Better error spans in arrays and arrow functions
  • Error on most-overlapping types in unions or “pick most overlappy type”
  • Related spans on a typed this being shadowed
  • A new warning message that says Did you forget a semicolon? on parenthesized expressions on the next line is added
  • More specific messages are displayed when assigning to const/readonly bindings
  • When extending complex types, more accurate messages are shown
  • Relative module names are used in error messages

Improved narrowing for tagged unions

TypeScript now makes narrowing easier by relaxing rules for a discriminant property. The common properties of unions are now considered discriminants as long as they contain some singleton type and contain no generics. For example, a string literal, null, or undefined.

Editing improvements

The TypeScript project doesn’t have a compiler/type-checker. The core components of the compiler provide a cross-platform open-source language service that can power smart editor features. These features include go-to-definition, find-all-references, and a number of quick fixes and refactorings.

Implicit any suggestions and “infer from usage” fixes

noImplicitAny is a strict checking mode, and it helps ensure the code is as fully typed as possible. This also leads to a better editing experience.

TypeScript 3.2 produces suggestions for most of the variables and parameters that would have been reported as having implicit any types. TypeScript provides a quick fix to automatically infer the types when an editor reports these suggestions.

Other fixes

There are two smaller quick fixes:

  • A missing new is added when a constructor is called accidentally.
  • An intermediate assertion is added to unknown when types are sufficiently unrelated.

Improved formatting

TypeScript 3.2 is smarter in formatting several different constructs.

Breaking changes and deprecations

  • TypeScript has moved more to generating DOM declarations in lib.d.ts by leveraging IDL files.
  • Certain parameters no longer accept null or accept more specific types.
  • Certain WebKit-specific properties have been deprecated.
  • wheelDelta and friends have been removed as they are deprecated properties on WheelEvents.

JSX resolution changes

The logic for resolving JSX invocations has been unified with the logic for resolving function calls. This action has simplified the compiler codebase and improved certain use-cases.

The further TypeScript releases will need Visual Studio 2017 or higher.

For more details, visit the Microsoft Blog.

Read next

Introducing ReX.js v1.0.0 a companion library for RegEx written in TypeScript

Vue.js 3.0 is ditching JavaScript for TypeScript. What else is new?

Babel 7 released with Typescript and JSX fragment support