Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'Type'

758 views Asked by At

I am trying to trim the values from an array of objects that is returned from a REST API.

This is the interface for the object I'm expecting.

interface IProduct {
  productId: number;
  qty: number;
  code: string;
  customer: string;
  description: string;
}

I'm trying to loop through the array of objects and trim all the values of the object.

products.forEach(record => {
  if (record) {
    Object.keys(record).map(key => {
      record[key] = record[key].trim();
    });
  }
});

I'm getting the following error.

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'IProduct'.
No index signature with a parameter of type 'string' was found on type 'IProduct'.

I've tried adding an index signature to the object but had no luck. [key: string]: string and also key: {[index: string]: string}.

Is there something I'm missing, I thought this would be enough to make the TS compiler to stop complaining.

Here is a reference of the object.

const products: Product[] = [
  {
    productId: 1,
    qty: 100,
    code: 'code',
    customer: 'customer',
    description: 'the description',
  },
  {
    productId: 2,
    qty: 102,
    code: 'code',
    customer: 'customer',
    description: 'the description',
  },
];

Many thanks

1

There are 1 answers

0
Lauren Yim On BEST ANSWER

The definition for Object.keys is:

interface ObjectConstructor {
  keys(o: object): string[];
  keys(o: {}): string[];
}

This is because you can write code like this:

const object = {
  productId: 1,
  qty: 100,
  code: 'code',
  customer: 'customer',
  description: 'the description',
  someOtherKey: 'foo', // extra key here
};
const product: IProduct = object;
const keys = Object.keys(product); // keys contains someOtherKey

To fix your error, you could use a type assertion:

products.forEach(record => {
  if (record) {
    (Object.keys(record) as (keyof IProduct)[]).map(/* ... */);
  }
});

However, if you know there will be no extra keys, you could add this overload:

declare global {
  interface ObjectConstructor {
    keys<K extends PropertyKey>(o: Record<K, unknown>): K[];
  }
}
// declare global can only be in a module, so if the file isn't
// a module already you'll need to add this
export {};

This way, you won't need a type assertion, but this is technically not type safe.