As a quirk of TypeScript, it does not allow for returning a Tuple directly and instead interprets it as an Array

Question

As a quirk of TypeScript, it does not allow for returning a Tuple directly and instead interprets it as an Array

I need assistance with adding type-safe return to a general function created by a previous developer. Here is the current syntax:

export function to(promise:Promise<any>) {  
  return promise
    .then(data => [null, data])
    .catch(err =>  [err, null]);
 }

This function simply takes in a promise and returns a new promise with an output type of a tuple

[Error|null, <The First Promise's Return Type>|null]

. This means that the first value will be an error if there is one (otherwise null), and the second value will be the result of the initial promise (otherwise null). Usage example:

const [ err, result ] = await to(/*<API Call>*/);
if (err) {
    setError(err);
    // ...
} else if (result) {
    processApiResult(result);
    // ...
}

Currently, I am aware that there is an issue ((T|null)[] should not represent "an array of either of those types", but rather "a tuple of those types with a specific order"), but I have been struggling to find a solution.

export function to<T>(promise:Promise<T>):Promise<(T|null)[]|[Error, null]> {  
  return promise
    .then(data => [null, data])
    .catch(err => [err as Error, null]);
 }
 
const [ err, result ] = await to(api.changePassword(username, password));  
// const error : string | Error | null
// const result : string | null

The expected type for the first parameter should be Error | null (not | string), while the second parameter is correctly defined as string | null.

typescript promise es6-promise

Answer 1

Answer №1

If you're confident that the tuples generated by to() won't be altered, you can apply const assertions to type this function.

export function to<T>(promise:Promise<T>):Promise<readonly [Error | null, T | null]>  {  
  return promise
    .then(data => [null, data] as const)
    .catch(err => [err as Error, null] as const);
}

const [ err, result ] = await to(api.changePassword(username, password));  
// err: Error | null
// result: string | null

This approach works because as const will convert the array literals' types into readonly tuples.

If there's a need for the tuples not to be read-only, an alternative method is available:

export function to<T>(promise:Promise<T>):Promise<[Error | null, T | null]>  {  
  return promise
    .then(data => [null, data] as [null, T])
    .catch(err => [err as Error, null] as [Error, null]);
}

const [ err, result ] = await to(api.changePassword(username, password));  
// err: Error | null
// result: string | null

In either scenario, it is crucial to communicate to the compiler that the values returned by to() are fixed-sized tuples, not arrays.

Answer 2

If you're confident that the tuples generated by to() won't be altered, you can apply const assertions to type this function.

export function to<T>(promise:Promise<T>):Promise<readonly [Error | null, T | null]>  {  
  return promise
    .then(data => [null, data] as const)
    .catch(err => [err as Error, null] as const);
}

const [ err, result ] = await to(api.changePassword(username, password));  
// err: Error | null
// result: string | null

This approach works because as const will convert the array literals' types into readonly tuples.

If there's a need for the tuples not to be read-only, an alternative method is available:

export function to<T>(promise:Promise<T>):Promise<[Error | null, T | null]>  {  
  return promise
    .then(data => [null, data] as [null, T])
    .catch(err => [err as Error, null] as [Error, null]);
}

const [ err, result ] = await to(api.changePassword(username, password));  
// err: Error | null
// result: string | null

In either scenario, it is crucial to communicate to the compiler that the values returned by to() are fixed-sized tuples, not arrays.

Answer 3

Answer №2

function convertPromise<T>(promise:Promise<T>):Promise<[Error|null,T|null]> {
    return promise
        .then((data):[null,T] => ([null, data]))
        .catch((err) =>( [err, null]));
}

async function asyncFunc() {
    const [ error, result ] = await convertPromise<string>(new Promise(resolve => resolve));
    console.log(error,result)
}

Answer 4

function convertPromise<T>(promise:Promise<T>):Promise<[Error|null,T|null]> {
    return promise
        .then((data):[null,T] => ([null, data]))
        .catch((err) =>( [err, null]));
}

async function asyncFunc() {
    const [ error, result ] = await convertPromise<string>(new Promise(resolve => resolve));
    console.log(error,result)
}

As a quirk of TypeScript, it does not allow for returning a Tuple directly and instead interprets it as an Array

Answer №1

Answer №2

Similar questions

Using TypeScript to specify a limited set of required fields

Mocking is not working for request scoped injection

An unusual problem encountered while working with NextJS and NextAuth

Utilizing typescript to isolate specific functionality from a class without extending it

Out of the blue, I encountered an issue while trying to install Express in node.js using Types

Error: Unhandled promise rejection - The function get is not part of this.categoryMap

Implementing redux-persist with redux toolkit using TypeScript

A loop in JavaScript/TypeScript that runs precisely once every minute

Is it not possible to call this authentication expression in a Typescript file when using Next JS?

deliver a precise observable

The error message "Unable to access property 'open' of an undefined menu" is being displayed in a TypeScript code

Confirming changes to checkbox values in Angular 2 prior to updating

Having trouble managing TypeScript in conjunction with React and Redux

Using Angular: A guide to setting individual values for select dropdowns with form controls

Which rxjs operator should be used when dealing with nested subscriptions in the presence of an if statement?

How can we leverage mapped types in TypeScript to eliminate properties and promisify methods?

What is the best way to merge the results of several runs of an observable function

Can a generic type be utilized to instantiate an object?

How can TypeScript be forced to output a specific data type?

What steps can be taken to resolve the error message "Using 'null' as an index type is not allowed."?