Const type parameters bring 'as const' to functions

I got a message from my friend Tom on Twitter the other day:

Tom Sherman

@tomus_sherman

Hey @mattpocockuk this is really bugging me!

I'm sure there was a feature that let me do

fn('hello')

and it'd be equivalent to

fn('hello' as const)

Can't find any docs about it tho, have I made this feature up?

Turns out he hadn't made it up.

TypeScript 5.0 introduced a brand-new piece of syntax to the language: const type parameters.

const myFunc = <const T>(input: T) => {
  return input;
};

To understand why it's useful, let's first take a look at a function that doesn't use a const type parameter:

const myFunc = <T>(input: T) => {
  return input
}

Let's say you call myFunc using an object:

const result = myFunc({foo: 'bar'})

The type of result will be { foo: string }. This is exactly the same as if you'd declared your object as a variable:

const myObj = {foo: 'bar'} // { foo: string }

If you hover over myObj in VS Code, you'll see that the type is the same as above - { foo: string }.

But what if we don't want to infer a string, but instead the literal bar?

On the variable, we can use as const to do this:

const myObj = {foo: 'bar'} as const // { readonly foo: "bar" }

But how do we handle it on the function? Enter the const type parameter:

const myFunc = <const T>(input: T) => {
  return input;
};

const result = myFunc({ foo: "bar" }); // { readonly foo: "bar" }

This is a really useful way of preserving the literal types of objects passed to your functions.

How are you planning on using const type parameters? Let me know on my Discord Server.