How to Cast Object to Interface in TypeScript ?

Last Updated : 23 Apr, 2024

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:

Table of Content

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;