Open In App

How to Cast Object to Interface in TypeScript ?

Last Updated : 23 Apr, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

In TypeScript, sometimes you need to cast an object into an interface to perform some tasks.

There are many ways available in TypeScript that can be used to cast an object into an interface as listed below:

Using the angle bracket syntax

You can use the type assertion to cast the object into an interface by defining an interface and using the name of that interface inside angled brackets(<>).

Syntax:

interface interface_name {};
const objectName = {}
const castedInterface = <interface_name> objectName;

Example: The below code example will help you in casting an interface to an object using type assertion.

Javascript
interface newInterface {
    name: string,
    desc: string
}

const GFG_Obj: any = {
    name: "GeeksforGeeks",
    desc: "A Computer Science Portal."
}

const newCastedInterface = <newInterface> GFG_Obj;

Using the as keyword

We can use the as keyword to cast the object into an interface by using the below syntax.

Syntax:

interface interface_name {};
const objectName = {};
const castedInterface = objectName as interface_name;

Example: The below example is an practical implementation of casting an object into an interface using the as keyword.

Javascript
interface newInterface {
    name: string,
    desc: string
}

const GFG_Obj: any = {
    name: "GeeksforGeeks",
    desc: "A Computer Science Portal."
}

const newCastedInterface = GFG_Obj as newInterface;

Using the spread operator

The spread operator syntax can also be used to cast an object into an interface by simply specifying the type of the new object as interface and assign the value of the object using spread operator syntax as shown in below syntax.

Syntax:

interface interface_name {}; 
const objectName = {}; 
const castedInterface: interface_name = {...objectName};

Example: The below code example will explain the use of the spread operator to cast an object into an interface.

Javascript
interface newInterface {
    name: string,
    desc: string
}

const GFG_Obj: any = {
    name: "GeeksforGeeks",
    desc: "A Computer Science Portal."
}

const newCastedInterface: newInterface = { ...GFG_Obj };

Using Type Assertion with Object Properties

You can also cast an object to an interface by directly assigning it to a variable of the interface type using type assertion. This method is particularly useful when you have an object with properties that match those defined in the interface.

Syntax:

interface InterfaceName {
    property1: type1;
    property2: type2;
    // Other properties...
}

const objectName: any = {
    property1: value1,
    property2: value2,
    // Other properties...
};

const castedObject: InterfaceName = objectName as InterfaceName;

Example: In this example we initializes an object userData with properties name and age, then asserts it as type User using type assertion (as), potentially risking runtime type mismatches.

JavaScript
interface User {
    name: string;
    age: number;
}

const userData: any = {
    name: "GeeksForGeeks",
    age: 22,
};

const user: User = userData as User;




Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads