Get the data property from the interface and define the return type

Question

Get the data property from the interface and define the return type

In my function, I am trying to extract data from an object structured by an interface. I want this function to specifically resolve the property data from the data object. While it works when I have any as the return type, I believe there should be a more efficient approach where the return type will match the type of the property.

Here is my current approach: Check out my code here

https://i.sstatic.net/OL8xE.png

Currently, I am only getting back a union type of all properties of the interface, but I am aiming to return the type of the specific property I want.

typescript

Answer 1

Answer №1

To enhance reusability, consider making the getData function generic and utilizing the generic type for both the input argument and return value:

interface Information {
  name:string,
  id:number,
}

const data: Information = {
  name:"example",
  id:1,
};

function getData<T extends keyof Information>(property: T): Information[T] {
  return data[property];
}

const example:string = getData("name");

Click here for interactive demo

Answer 2

To enhance reusability, consider making the getData function generic and utilizing the generic type for both the input argument and return value:

interface Information {
  name:string,
  id:number,
}

const data: Information = {
  name:"example",
  id:1,
};

function getData<T extends keyof Information>(property: T): Information[T] {
  return data[property];
}

const example:string = getData("name");

Click here for interactive demo

Get the data property from the interface and define the return type

Answer №1

Similar questions

Remove the ability to select from the dropped list item

What is the method for retrieving the second type of property from an array of objects?

[Vue warning]: The property "text" was accessed during rendering, however it is not defined on the current instance using Pug

Is there a way for Ionic to remember the last page for a few seconds before session expiry?

Implementation of a function in Typescript that can be defined with a

Tips for effectively highlighting search text within HTML content without causing any issues

The geolocation feature is operational in the browser test, but it is not functioning properly on the

To enhance VS IntelliSense and type checking in react-intl's FormattedMessage component, assign an id that aligns with a custom TypeScript interface

Using MUI DatePicker and react-hook-form to implement a date picker in the format DD/MM/YYYY

Toggle Button in Angular upon Form Changes

The functionality of TypeScript's .entries() method is not available for the type 'DOMTokenList'

Refreshing the cache in SWR, but the user interface remains unchanged inexplicably - SWR hook in Next.js with TypeScript

Angular Material 2: Sidenav does not come with a backdrop

What is the best way to locate every object based on its ID?

Issue with method assignment in extending Array class in Typescript

What's with all the requests for loaders on every single route?

What does ngModel look like without the use of square brackets and parenthesis?

Error TS2304: Unable to locate the word 'InputEvent'

Can you explain to me the significance of `string[7]` in TypeScript?

Is there a workaround for utilizing reducer dispatch outside of a React component without relying on the store?