Categorizing the types of dynamically retrieved object values

Question

Categorizing the types of dynamically retrieved object values

I've developed a unique class with two properties that store arrays of tuples containing numbers. Additionally, I've implemented a method called "getIndex" which dynamically accesses these properties and checks for duplicate number values within the tuples. Here's the function in question:

  getIndex(posX: number, posY: number, pathArr: string) {
    for (let routeCoordinates of this[pathArr]) {
      if (routeCoordinates[0] === posX && routeCoordinates[1] === posY) {
        return this[pathArr].indexOf(routeCoordinates);
      }
    }
  }

The issue arises when attempting to pass pathArr as a key, resulting in the following error message:

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

I'm aware of generics, but the solutions I've come across online don't seem to work well with instances of classes. Is there any way to solve this while maintaining type checking?

javascript typescript oop types

Answer 1

Answer №1

An easy fix for this issue is to modify the pathArr: string parameter to

pathArr: keyof PathfinderSecondStage

. This will prompt TypeScript to generate a union type of all public fields/methods within the class and then extract the this[pathArr] statement, assigning it to a variable with the help of type assertion to specify the exact type being used:

 getIndex(posX: number, posY: number, pathArr: keyof PathfinderSecondStage) {
    const myArray = this[pathArr] as number[][];
    for (let routeCoordinates of myArray) {
      if (routeCoordinates[0] === posX && routeCoordinates[1] === posY) {
        return myArray.indexOf(routeCoordinates);
      }
    }
  }

To further narrow down the allowed values for the pathArr parameter, you can specifically list the field names containing arrays that can be traversed within the function like so:

getIndex(posX: number, posY: number, pathArr: 'fieldName1'|'fieldName2') {

This approach reduces the variety of types that TypeScript has to create union types for. If all the fields are arrays of numbers (number[][]), the type assertion from the first example may not be necessary.

Answer 2

An easy fix for this issue is to modify the pathArr: string parameter to

pathArr: keyof PathfinderSecondStage

. This will prompt TypeScript to generate a union type of all public fields/methods within the class and then extract the this[pathArr] statement, assigning it to a variable with the help of type assertion to specify the exact type being used:

 getIndex(posX: number, posY: number, pathArr: keyof PathfinderSecondStage) {
    const myArray = this[pathArr] as number[][];
    for (let routeCoordinates of myArray) {
      if (routeCoordinates[0] === posX && routeCoordinates[1] === posY) {
        return myArray.indexOf(routeCoordinates);
      }
    }
  }

To further narrow down the allowed values for the pathArr parameter, you can specifically list the field names containing arrays that can be traversed within the function like so:

getIndex(posX: number, posY: number, pathArr: 'fieldName1'|'fieldName2') {

This approach reduces the variety of types that TypeScript has to create union types for. If all the fields are arrays of numbers (number[][]), the type assertion from the first example may not be necessary.

Answer 3

Answer №2

Understanding the context of this[] requires access to the complete code, however, one way to enable string indexing in a Typescript array is by defining it as

let COLLECTION: { [identifier: string]: DATA_TYPE; } = {};

. Here, COLLECTION represents your array's name and DATA_TYPE signifies the type of data being stored.

Answer 4

Understanding the context of this[] requires access to the complete code, however, one way to enable string indexing in a Typescript array is by defining it as

let COLLECTION: { [identifier: string]: DATA_TYPE; } = {};

. Here, COLLECTION represents your array's name and DATA_TYPE signifies the type of data being stored.

Categorizing the types of dynamically retrieved object values

Answer №1

Answer №2

Similar questions

Find the smallest number within an array without relying on the Math function

I am attempting to secure a webpage with a password using JavaScript

When using AngularJS services to pass data, the data may be lost when the page is refreshed

What could be the reason behind an Ajax Auto-Complete feature suddenly malfunctioning when moving to a new page within the same website?

Steps to generate an error in the 'response' function of a $httpProvider interceptor

Which is better for privacy: underscored prototype properties or encapsulated variables?

How can I get the class name of the drop destination with react-dnd?

What is the reason for the service not providing an encoded string as output?

Divide the string into several segments according to its position value

Avoid retrieving data during the fetching process

ReactJS encountering an invalid dropzone element

Update image attributes (such as src, alt, etc.) after a successful AJAX request (and also help me troubleshoot my AJAX

Retrieving Axios error codes within an interceptor

Creating a React functional component that updates state when a specific window breakpoint is reached

I'm looking for assistance on programmatically adding or modifying the user-agent header in a Chrome browser using Selenium WebDriver. Can anyone help

Using Generic Types in Response DTO with Typescript, NestJs, and Class Transformer

I need help figuring out the proper way to establish an indexing path in cosmos db using the nodejs sdk

Organizing a collection of clothing sizes with a mix of different measurements using JavaScript

Discovering the most concise string within the array

What is the best way to incorporate progress updates into a rendered jade page?