TypeScript Intersection Type

TypeScript Intersection Type

An intersection type use for combine/merge multiple types into one. Intersection type have all the members of combined types.   You can declare the  by and sign(&). All members of all the types are required in the object of an intersection type.

For example:

  

        interface IPerson {
        firstName: string;
        lastName: string;
        age: number;
        }
        interface IEmployee {
        empCode: string;
        }

        let employeeObj:  IPerson & IEmployee = {
        firstName: 'John',
        lastName: 'Doe',
        age: 20,
        empCode: 'E0001'
        }

        console.log(employeeObj);  // { firstName: 'John', lastName: 'Doe', age: 20, empCode: 'E0001' }
    

In the above code snippet,  IPerson and IEmployee  type is separated by & sign. employeeObj object has all the members of IPerson and IEmployee interfaces. All the members of IPerson and IEmployee interface declared within employeeObj and it is required to declare all the members of intersection types.  If  you does not declare all the members then compiler will throw the error message.

JavaScript compiled Code:

  

        let employeeObj = {
        firstName: 'John',
        lastName: 'Doe',
        age: 20,
        empCode: 'E0001'
        };
        console.log(employeeObj);
    

In below code snippet, empCode is not declared within employeeObj, try to compile the code and compiler throwing the below error message.

  

        interface IPerson {
        firstName: string;
        lastName: string;
        age: number;
        }
        interface IEmployee {
        empCode: string;
        }

        let employeeObj:  IPerson & IEmployee = {
        firstName: 'John',
        lastName: 'Doe',
        age: 20,

        }

        console.log(employeeObj);
    
  

        intersection.ts:12:7 - error TS2322: Type '{ firstName: string; lastName: string; age: number; }' is not assignable to type 'IPerson & IEmployee'.
        Property 'empCode' is missing in type '{ firstName: string; lastName: string; age: number; }' but required in type 'IEmployee'.

        12   let employeeObj:  IPerson & IEmployee = {
        ~~~~~~~~~~~

        intersection.ts:8:5
        8     empCode: string;
        ~~~~~~~
        'empCode' is declared here.

        Found 1 error.
    

If two types have the same properties name with different data type, then automatically assigned the never type. This means you cannot assign any value to it.

  

        interface IPerson {
        firstName: string;
        lastName: string;
        age: number;
        }
        interface IEmployee {
        empCode: string;
        age :string
        }

        let employeeObj:  IPerson & IEmployee = {
        firstName: 'John',
        lastName: 'Doe',
        age: 20,
        empCode:'E0001'

        }
    

In the above code snippet, age property is declared within both interface IPerson and IEmployee with different data type string and number. If you try to compile the above code, then compiler will the throw the below error message.

  

        intersection.ts:16:5 - error TS2322: Type 'number' is not assignable to type 'never'.

        16     age: 20,
        ~~~

        intersection.ts:5:5
        5     age: number;
        ~~~
        The expected type comes from property 'age' which is declared here on type 'IPerson & IEmployee'

        Found 1 error.