Steps to resolve the issue of 'type is not assignable to any' while working with a member

Question

Steps to resolve the issue of 'type is not assignable to any' while working with a member

I'm facing an issue with a code snippet like the one below:

interface IFoo {
  bar: string;
  baz: number;
}

function f(foo: IFoo, name: 'bar' | 'baz', val: any) {
  foo[name] = val;   // <<< error: Type 'any' is not assignable to type 'never'.
}

Surprisingly, when I change the type of "baz" to also be "string", the error disappears:

interface IFoo {
  bar: string;
  baz: string;
}

function f(foo: IFoo, name: 'bar' | 'baz', val: any) {
  foo[name] = val;   // fine
}

I am curious about the reason behind this behavior and whether there's a solution that doesn't involve changing name: 'bar' | 'baz' to name: string.

typescript

Answer 1

Answer №1

It is essential to verify that the data stored in val matches the data type expected for the corresponding name.

Experience Typescript with this Example

interface IFoo {
  bar: string;
  baz: number;
}

function f<K extends keyof IFoo>(foo: IFoo, name: K, val: IFoo[K]) {
  foo[name] = val;
}

const foo: IFoo = {
    bar: '',
    baz: 0
}

f(foo, 'bar', 'abc')
f(foo, 'baz', 1)
console.log(foo);

You can also make it more generic.

function f<T, K extends keyof T>(foo: T, name: K, val: T[K]) {
  foo[name] = val;
}

Try out the Playground Example

Answer 2

It is essential to verify that the data stored in val matches the data type expected for the corresponding name.

Experience Typescript with this Example

interface IFoo {
  bar: string;
  baz: number;
}

function f<K extends keyof IFoo>(foo: IFoo, name: K, val: IFoo[K]) {
  foo[name] = val;
}

const foo: IFoo = {
    bar: '',
    baz: 0
}

f(foo, 'bar', 'abc')
f(foo, 'baz', 1)
console.log(foo);

You can also make it more generic.

function f<T, K extends keyof T>(foo: T, name: K, val: T[K]) {
  foo[name] = val;
}

Try out the Playground Example

Steps to resolve the issue of 'type is not assignable to any' while working with a member

Answer №1

Similar questions

How is it possible that my code is continuing to run when it is supposed to be

Creating a grid UI in AngularJS using Typescript: utilizing functions as column values

What is the best way to assign a value to a class variable within a method by referencing the 'this' keyword?

Is it possible to execute user-defined functions dynamically in a Node.js application without having to restart the server

Is your Angular2 form page experiencing reloading issues?

Using ES6 and Typescript, when a button is clicked, apply a class to all TD elements within the button except for the first one. No need for jQuery

Issue with Angular 5 EventEmitter causing child to parent component emission to result in undefined output

Getting the local path of a file from an input file in Angular 7

Creating a JSON object from an array of data using TypeScript

Is it possible for a typed function to access object properties recursively?

What method can be used to specify a function of any signature that returns a particular type in programming?

Exploring the usage of arrays within Angular 4 components. Identifying and addressing overlooked input

Applying a Typescript Generic to enhance the functionality of the API fetcher

Typescript struggling to comprehend the conditional rendering flow

Error encountered in spyOn TS when passing array iteration instead of a string

Encountering an issue while compiling with TypeScript, where a typescript class that involves Meteor and Mongo is throwing an error stating "Property 'Collection' does not exist on type 'typeof Mongo'."

Stop MatDialog instance from destroying

Make Ionic 2 Navbar exclusively utilize setRoot() instead of pop()

What is the best way to merge multiple nested angular flattening operators together?

Retrieving results from PostgreSQL database using pagination technique