What does the ampersand (&) mean in a TypeScript type definition?

TypesTypescriptAmpersand

Types Problem Overview


On line 60359 of this type definition file, there is the following declaration:

type ActivatedEventHandler = (ev: Windows.ApplicationModel.Activation.IActivatedEventArgs & WinRTEvent<any>) => void;

What does the & sigil mean in this context?

Types Solutions


Solution 1 - Types

& in a type position means intersection type.

More from typescript docs on Intersection Types:

https://www.typescriptlang.org/docs/handbook/2/objects.html#intersection-types

Citation from the docs linked above:

>Intersection types are closely related to union types, but they are used very differently. An intersection type combines multiple types into one. This allows you to add together existing types to get a single type that has all the features you need. For example, Person & Serializable & Loggable is a type which is all of Person and Serializable and Loggable. That means an object of this type will have all members of all three types. > >For example, if you had networking requests with consistent error handling then you could separate out the error handling into it’s own type which is merged with types which correspond to a single response type.

interface ErrorHandling {
  success: boolean;
  error?: { message: string };
}

interface ArtworksData {
  artworks: { title: string }[];
}

interface ArtistsData {
  artists: { name: string }[];
}

// These interfaces are composed to have
// consistent error handling, and their own data.

type ArtworksResponse = ArtworksData & ErrorHandling;
type ArtistsResponse = ArtistsData & ErrorHandling;

const handleArtistsResponse = (response: ArtistsResponse) => {
  if (response.error) {
    console.error(response.error.message);
    return;
  }

  console.log(response.artists);
};

Solution 2 - Types

Intersection type in Typescript

  • A & in TS in the context of a types means an intersection type.

  • It merges all properties of 2 object types together and creates a new type


Example:

type dog = {age: number, woof: Function};
type cat = {age: number, meow: Function};

// Type weird is an intersection of cat and dog
// it needs to have all properties of them combined
type weird = dog & cat;

const weirdAnimal: weird = {age: 2, woof: () => {'woof'}, meow: () => {'meow'}}

interface extaprop {
    color: string
}

type catDog = weird & extaprop; // type now also has added color
const weirdAnimal2: catDog = {age: 2, woof: () => {'woof'}, meow: () => {'meow'}, color: 'red'}


// This is different form a union type
// The type below means either a cat OR a dog
type dogOrCat = dog | cat;

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionCarl Patenaude PoulinView Question on Stackoverflow
Solution 1 - TypesbasaratView Answer on Stackoverflow
Solution 2 - TypesWillem van der VeenView Answer on Stackoverflow