What is the proper classification for me to choose?

Apologies for the lack of a suitable title, this question is quite unique.

I am interested in creating a function called setItem that will assign a key in an object to a specific value:

const setItem = <T, U extends keyof T>(obj: T) => (key: U, value): void => {
    obj[key] = value
}

const person = {
    name: 'James',
    age: 13,
}

const setPerson = setItem(person)
setPerson('name', 125)

Despite setting the name property to a number, there are no compile time errors (due to the current type being 'any').

How can I instruct TypeScript to enforce the typeof value for obj[key]?

typescripttypescript-typingstypescript-generics

Answer №1

To trigger an "implicit any" warning from the compiler, enable the --strict mode and set the type of value to be T[U], a lookup type.

When creating a curried generic function like the one below, ensure that the type parameters are in the correct order:

const setItem = <T>(obj: T) => <U extends keyof T>(key: U, value: T[U]): void => {
    obj[key] = value;
}

The setItem(obj) call should return a generic function that accepts any U extends keyof T for key, so the parameter U must be on the returned function. Placing <T, U> on the initial function will lead to inference issues with U, potentially causing errors.

Test the functionality with the example provided:

const person = {
    name: 'James',
    age: 13,
}
const setPerson = setItem(person)
setPerson('name', 10); // error
setPerson('name', 'Jill'); // okay
setPerson('age', 10); // okay
setPerson('age', 'Jill'); // error

Playground link to code

Best of luck implementing this! Hope it proves helpful.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the significance of parentheses when used in a type definition?

The index.d.ts file in React contains an interface definition that includes the following code snippet. Can you explain the significance of the third line shown below? (props: P & { children?: ReactNode }, context?: any): ReactElement<any> | nu ...

typescripttypescript-typings

Having trouble appending a new attribute to the Mongoose output

In my Nodejs server application, I am working with a userDetail document that contains all the relevant user information. Additionally, I have a login document that stores the time of the first login, which I need to incorporate into the userDetails result ...

javascriptangularjsnode.jsmongodbtypescript

Searching for client using mqtt.js in Angular2 with Typescript yields no results

I am facing a unique issue while trying to incorporate the mqtt.js library into Angular 2 using TypeScript. Below is my app.component.ts file: import { Component } from '@angular/core'; import * as mqtt from 'mqtt'; @Component({ sel ...

javascriptangulartypescriptmqtt

The parameter type '(req: Request, res: Response, next: NextFunction) => void' does not match the type of 'Application<Record<string, any>>'

I'm currently working on an Express project that utilizes TypeScript. I have set up controllers, routers, and implemented a method that encapsulates my controller logic within an error handler. While working in my router.ts file, I encountered an err ...

node.jstypescriptexpress

Pausing in a NodeJS HTTP request listener until receiving another response before proceeding

Essentially, this is a web proxy. Within a request listener, I am creating another http request, reading its response, and passing it to the main response. But I have the challenge of needing to wait for the secondary request to complete before continuing. ...

node.jstypescript

Flex-Layout in Angular - The Ultimate Combination

Recently, I decided to delve into Angular and the Flex-Layout framework. After installing flex-layout through npm, I proceeded to import it in my app.module.ts file like so: import { FlexLayoutModule } from '@angular/flex-layout'; imports: [ Fl ...

angulartypescriptfrontendangular-flex-layout

Instantiate an object of the ng.IQService type without using injection

Is it possible to define a local variable in the controller of type ng.IQService ( private _q: ng.IQService;) without requiring injection? My technology stack includes typescript and angular. The reason for this requirement is due to existing legacy code ...

angularjstypescript

Error Type: TypeError when using Mongoose's FindOneAndUpdate function

I am encountering difficulties while trying to implement a findOneAndUpdate query. //UserController UserDAO ['findOneAndUpdate'](userId, {& ...

node.jstypescriptmongoosemongoose-schema

Creating a cutting-edge object using Angular 4 class - The power of dynamism

Attempting to create a dynamic object within a function, but encountering recognition issues. function1(object: object) { return new object(); } The function is invoked as follows: function1(Test) 'Test' represents a basic Class implementatio ...

angularclasstypescript

Increasing a number after a delay in an Angular 2 AppComponent using TypeScript

I'm attempting to create a straightforward Angular2 Application with TypeScript. Despite its apparent simplicity, I'm struggling to achieve my desired outcome. My goal is to display a property value in the template and then update it after 1 sec ...

typescriptangular

What is the correct way to utilize a variable as a parameter in React Query while employing the axios.request(options) method?

I'm currently working on a React Query component with the following structure: function test () { const [var, setVar] = useState("") const options = { method: "GET", url: "https://api.themoviedb.org/3/search/tv" ...

javascriptreactjstypescriptreact-typescriptreact-query

Issue when utilizing TypeScript MongoDB Definitions (Unable to locate namespace)

I am currently working on implementing MongoDB typings that I installed using the following command: npm install @types/mongodb -D Now, I want to utilize these types within a function like this: export default async function insertOne(collection:any, da ...

node.jsmongodbtypescripttypescript-typings

The properties required for type 'Subscription' are not present

I encountered an issue in my IDE while trying to run the following code. Within my component, I am making a call to a service in the ngOnInit method to fetch some data. This service, in turn, calls another service to gather additional information before f ...

angulartypescriptobservable

Request with missing authentication header in Swagger OpenAPI 3.0

When generating the swagger.json using tsoa for TypeScript, I encountered an issue. Even after adding an access token to the authorize menu in Swagger and making a request to one of my endpoints, the x-access-token header is missing from the request. What ...

typescriptswaggeropenapitsoa

What's causing the "* before initialization" error in Vue with TypeScript?

I am encountering an issue with my code where I get the error "Cannot access 'AuthCallback' before initialization" when attempting to call the router function in the AuthCallback component. What could be causing this problem? The desired function ...

typescriptvue.jsvue-router

Tips for keeping a specific key value pair as the final entry in a Typescript Object

My goal is to construct a Typescript Object that has a specific element with the key 'NONE' always positioned at the end. This arrangement is crucial for displaying the object in my HTML page with this value appearing last. I am seeking an implem ...

javascriptangulartypescriptobjectkey-value

Utilizing the Composition Root concept in a TypeScript Express application

I am trying to grasp the concept of implementing a composition root in a project. Based on my research, improper usage of the composition root (such as referencing it in multiple places within your application code) can lead to the service locator antipat ...

typescriptexpressdependency-injectionarchitecturecompositionroot

An error occurred while defining props due to a parsing issue with the prop type. The unexpected token was encountered. Perhaps you meant to use `{`}` or `}`?

const dataProps = defineProps({ selectedData: <Record<string, string>> }); Under the closing bracket, there is a red line indicating: Error: Unexpected token. Consider using {'}'} or &rbrace; instead?eslint Expression expecte ...

typescriptvue.js

How to create a collapse feature that allows only one item to be open at a time in Angular

I developed an angular app with a collapse feature, but I noticed that multiple collapses can be open at once. I am utilizing Ng-Bootstrap collapse for this functionality. Below is the code snippet from the TS file: public isCollapsed = true; And here is ...

angulartypescriptlayoutng-bootstrapcollapsable

Develop a fresh category inspired by the properties of objects

Let's tackle the challenge of constructing a new type in Typescript based on an descriptive object named schema, which contains all the requirements expressed within it. Here is my proposed solution: type ConfigParameter<IdType, ValueType> = Re ...

typescripttypescript-typingstypescript-generics