Home > front end >  Variadic Tuple Types: example from the docs
Variadic Tuple Types: example from the docs

Time:10-12

TS beginner. In docs it says in JS we could have such function:

function concat(arr1, arr2) {
  return [...arr1, ...arr2];
}

Then it says

For concat, the only valid thing we could do in older versions of the language was to try and write some overloads.

And then proceeds to show overloads (not all shown):

function concat(arr1: [], arr2: []): [];
function concat<A>(arr1: [A], arr2: []): [A];
function concat<A, B>(arr1: [A, B], arr2: []): [A, B];
function concat<A, B, C>(arr1: [A, B, C], arr2: []): [A, B, C];
.......

My question is: why in the older versions of the language we would need to use so many overloads? Are there no better primitives in the older versions of the language to type that function?

Basically I want an answer which explains why none of the existing primitives in the older version of the language could be used to type this

For example why not use concat(arr1: any[], arr2: any[])? etc.

Or why not use just tuples? Why we needed variadic?

CodePudding user response:

The primary goal of TypeScript is to add type information to otherwise untyped bare JavaScript. There are constructs like any that don't have type information, but they have specific purpose to be a temporary placeholder for transitioning from bare JavaScript to TypeScript.

When using TypeScript and writing a custom concat(…) function, one might want to reflect the fact that concat([T, U], [V, W]) is not just some array, but precisely [T, U, V, W].

("T", "U", "V", and "W" here are common placeholders for types.)

Now imagine that this function can accept any two arrays of any type. In order to write typings for such a function using pre-4.0 TypeScript you would have to use function overloads. This quickly gets very repetitive:

  • "if the first array is [] and the second array is [], the result is []"
  • "if the first array is [T], and the second array is [], the result is [T]"
  • "if the first array is [T, U], and the second array is [], the result is [T, U]"
  • "if the first array is [], and the second array is [V], the result is [V]"
  • "if the first array is [T], and the second array is [V], the result is [T, V]"

… and so on. That's very painful, isn't it?

With TypeScript 4.0 you can just infer the types of the input arrays and combine them ahead of time:

  • "the first array is some tuple A, and the second array is some tuple B, and the result is [...A, ...B]"

All the necessary information is there, there's nothing left to add. Hence, you don't need to use the repetitive and verbose overloads.

CodePudding user response:

it is mentioned right after:

"TypeScript 4.0 brings two fundamental changes, along with inference improvements, to make typing these possible."

Inference is the key word here. In other words typescript became smarter in understanding the code and figuring out which possible types could result out of [...arr, ...arr2]

In older versions you would need to do the "hard" work, now typescript is doing it for you.

  • Related