Ways to RESOLVE implicit any for accessing array property

Question

Ways to RESOLVE implicit any for accessing array property

Check out the code snippet below:

function getUsername(): string {
    return 'john_doe';
}

function sampleFunction(): void {
    const data = {};
    const username: string = getUsername();
    const age: any = 30;

    data[username] = age; // ERROR: TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
}

The error is visible because noImplicitAny is turned on for better code quality. What is a cleaner way to set this property in this context?

typescript tsconfig

Answer 1

Answer №1

To create a Record data type, follow these steps:

function generateKey(): string {
    return 'bar';
}

function placeholder(): void {
    const item: Record<string, any> = {}; // This is where you can specify the type of data, like string or number.
    const uniqueKey: string = generateKey();
    const dataValue: any = 42;

    item[uniqueKey] = dataValue; // No errors will be thrown
}

Answer 2

To create a Record data type, follow these steps:

function generateKey(): string {
    return 'bar';
}

function placeholder(): void {
    const item: Record<string, any> = {}; // This is where you can specify the type of data, like string or number.
    const uniqueKey: string = generateKey();
    const dataValue: any = 42;

    item[uniqueKey] = dataValue; // No errors will be thrown
}

Ways to RESOLVE implicit any for accessing array property

Answer №1

Similar questions

Championing React, TypeScript, and TSLint: A Pose of Cur

Passing data from child components to parent components in NextJs using Typescript

callback triggering state change

Empty Angular-chart.js Container

Is there a way to utilize ng-if within a button to reveal the remaining portion of a form using TypeScript?

Can someone please explain how to bring in the Sidebar component?

What is the method for implementing type notation with `React.useState`?

The clash between the definitions of identifiers in this file and another (@types/jasmine) is causing error TS6200

Error Message: ES5 mandates the use of 'new' with Constructor Map

Consolidate various arrays of objects while eliminating duplicate items based on an optional property

I'm struggling to get a specific tutorial to work for my application. Can anyone advise me on how to map a general URL to the HTTP methods of an API endpoint that is written in C

Create dynamic breadcrumb trails using router paths

Obtaining the host and port information from a mongoose Connection

Angular's HttpClient makes sure to wait for the HTTP requests to complete

Tips for creating an observable in Angular 2

Hand over the component method as an argument to a class

What is the correct way to implement "next-redux-wrapper" with "Next.js", "Redux-ToolKit" and Typescript?

An error was encountered at line 52 in the book-list component: TypeError - The 'books' properties are undefined. This project was built using Angular

The class assigns a property to an instance member, while the extended class '(Anonymous class)' designates it as an instance member function

What is the best way to utilize the next-env.d.ts file within Next.js?