Typescript Intersection types

Intersection types allow us to combine two or more types into one. The resulting type will have all the properties of all the types. This allows us to get a Single type from existing types that has all the properties of both the types

Using intersection types

We can create intersection type using the following syntax. Each type is separated by & sign.

let a : type1 & type2 & .. & .. & typeN

Example

The following code creates the intersection type student from the Person & Employee type. 

interface Person {
    name: string;
    age: number;
}

interface Student {
    studentCode: string;
    division: string
}


let student: Student & Person= {
    studentCode:"1",
    division:"10",
    name:"Rahul",
    age:20
}

Note that student has all the properties from the both the types. If you leave out of any one of the property as in name in the following code, the compiler will throw an error.

let student: Student & Person= {
    studentCode:"1",
    division:"10",
    age:20
}

//Type '{ studentCode: string; division: string; age: number; }' is not assignable to type 'Student & Person'.
// Property 'name' is missing in type '{ studentCode: string; division: string; age: number; }' but required in type 'Person'.

Common Primitive Property

It is allowed to have primitive property with same name & type as in the case of age in the example.

interface Person {
    name: string;
    age: number;
}

interface Student {
    studentCode: string;
    division: string
    age: number;
}

let student: Student & Person= {
    studentCode:"1",
    division: "10",
    name:"rahul",
    age:20
}

But if they differ in type, then resulting property will have the type never and you won’t be able to create the intersection until you fix the problem.

interface Person {
    name: string;
    age: number;
}

interface Student {
    studentCode: string;
    division: string
    age: string;
}

let student: Student & Person= {
    studentCode:"1",
    division: "10",
    name:"rahul",
    age:20                    //ERROR
}

//Error
Type 'number' is not assignable to type 'never'.(2322)
input.ts(9, 5): The expected type comes from property 'age' which is declared here on type 'Student & Person'

Common Non-Primitive Property

If you have a common non primitive property, then the typescripts creates an intersection of them also.

For Example, we have address property in both in Person & Student type. But they have different types ( HomeAddress & OfficeAddress). When we create interestsection of the Person & Student, the address becomes intersection of HomeAddress & OfficeAddress.

interface Homeaddress {
    Home1 : string
    Home2: string
}

interface Officeaddress {
    Office1 : string
    Office2: string
}

interface Person {
    name: string;
    age: number;
    address:Homeaddress
}

interface Student {
    studentCode: string;
    division: string
    age: number;
    address:Officeaddress
}

let student: Student & Person= {
    studentCode: "1",
    division:"10",
    name:"rahul",
    age: 20,
    address: {        //Intersection of Homeaddress & Officeaddress 
        Home1:"",
        Home2: "",
        Office1: "",
        Office2:""
    }
}

References

  1. Advanced Types

2 thoughts on “Typescript Intersection types”

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Scroll to Top