Creating a function in Typescript that accepts an array of strings and generates an output with the strings utilized as keys

Question

Creating a function in Typescript that accepts an array of strings and generates an output with the strings utilized as keys

I am working on a function that takes an array of strings and generates an object where the strings are used as keys with a value of true assigned to each.

Here is the code snippet for that:

return keys.reduce((result, key) => {
    result[key] = true;

    return result;
}, {});

I want to implement this function using TypeScript so that, when calling it, it will automatically detect that the returned object will have keys corresponding to the input array of strings.

Is there a way to accomplish this? I wish for the following code to be operational:

const result = myFunction(['key1', 'key2'])

When this is done, I hope TypeScript can identify result as an object with keys 'key1' and 'key2'.

Thank you to anyone who can offer assistance!

typescript

Answer 1

Answer №1

If you're looking for a function that can help you achieve this task, you can use the following code snippet (code sample):

const myFunction = <N extends string, T extends readonly N[]>(keys: T) => keys.reduce(
  (acc, key) => ({
    ...acc,
    [key]: true
  }), {} as { [K in T[number]]: true });

const result = myFunction(['key1', 'key2']) // { key1: true; key2: true; }

If you prefer, you can omit the type parameter N by using as const as shown in this code sample:

const myFunction = <T extends readonly string[]>(keys: T) => {/* as above */ }

const result = myFunction(['key1', 'key2'] as const) // { key1: true; key2: true; }

Answer 2

If you're looking for a function that can help you achieve this task, you can use the following code snippet (code sample):

const myFunction = <N extends string, T extends readonly N[]>(keys: T) => keys.reduce(
  (acc, key) => ({
    ...acc,
    [key]: true
  }), {} as { [K in T[number]]: true });

const result = myFunction(['key1', 'key2']) // { key1: true; key2: true; }

If you prefer, you can omit the type parameter N by using as const as shown in this code sample:

const myFunction = <T extends readonly string[]>(keys: T) => {/* as above */ }

const result = myFunction(['key1', 'key2'] as const) // { key1: true; key2: true; }

Creating a function in Typescript that accepts an array of strings and generates an output with the strings utilized as keys

Answer №1

Similar questions

Using React with Typescript and ie18next to fetch translations from an external API

Struggling to create an Extension Method for Map<TKey, TValue[]> in TypeScript

Applying the spread operator in the map function for copying objects

Different combinations of fields in Typescript types

Issue with updating component

What is the best way to convert the NextJS router.query.id to a string?

Adjusting the width of row items in Angular by modifying the CSS styles

Incorporate keyboard input functionality into an object wrapper

Developing a declaration for an unnamed function in a JavaScript file

What causes the "This page isn't responding" error to pop up in Edge and Chrome browsers while attempting to perform consecutive tasks in a web application built with Angular 8?

When working on styling a different Styled Component, how should one define the type of props required?

How do AppComponent and @Component relate to each other in AngularJs 2?

Using TypeScript to implement Angular Draggable functionality within an ng-template

Tips for creating a unit test case for a specialized validator in angular reactive forms

No solution was found for implementing Airbnb TypeScript in React.js (Next.js) using ESLint

Using TypeScript generics to add constraints to function parameters within an object

Leveraging Angular's capability to import files directly from the assets

Having difficulty implementing a versatile helper using Typescript in a React application

I am sorry, but there seems to be an issue with the JSON input as it is ending

AngularFire UPDATE -> APPLY CHANGES