Determining the output type by considering the presence of optional parameters

Question

Determining the output type by considering the presence of optional parameters

function customFunction<T>(defaultValue?: T) { return defaultValue; }

const definitelyNullOrUndefined = customFunction<string>();      // type: string | undefined
const definitelyStringType = customFunction<string>('foobar'); // type: string | undefined

Is there a way to modify customFunction() so that definitelyNullOrUndefined is automatically set to undefined, while definitelyStringType is automatically set to string?

Overview

I am interested in enhancing a function I am currently utilizing. This function is defined as

function customFunction<T>(obj: { [key: string]: T }, key: string, defaultValue?: T)

and it retrieves the value of key[obj] if it exists, otherwise using defaultValue. Even when a defaultValue is provided, Typescript interprets the return type as T | undefined.

typescript

Answer 1

Answer №1

When considering your initial case, my immediate suggestion is to utilize an overload approach, as demonstrated below:

function f<T>(): undefined;
function f<T>(value: T): T;
function f<T>(value?: T) { return value; }

const definitelyUndefined = f();      // type: undefined
const definitelyString = f('foobar'); // type: "foobar"

However, for the more intricate scenario at hand, it may be possible to address it by incorporating overloads and more elaborate generics, like so:

function f<T, K extends string & keyof T>(o: T, key: K, defaultValue?: T[K]): T[K];
function f<T, V = undefined>(o: T, key: string, defaultValue?: V): V;
function f<T, V = undefined>(o: T, key: string, defaultValue?: V) {
  return o[key] || defaultValue;
}

const obj = { foo: "123" };

const definitelyUndefined = f(obj, "bar");    // type: undefined
const definitelyNumber = f(obj, "bar", 123);  // type: number
const definitelyString = f(obj, "foo");       // type: string

While this solution may not cover every conceivable scenario (as the return type relies on the generic type argument rather than the actual function argument), it does come remarkably close.

Answer 2

When considering your initial case, my immediate suggestion is to utilize an overload approach, as demonstrated below:

function f<T>(): undefined;
function f<T>(value: T): T;
function f<T>(value?: T) { return value; }

const definitelyUndefined = f();      // type: undefined
const definitelyString = f('foobar'); // type: "foobar"

However, for the more intricate scenario at hand, it may be possible to address it by incorporating overloads and more elaborate generics, like so:

function f<T, K extends string & keyof T>(o: T, key: K, defaultValue?: T[K]): T[K];
function f<T, V = undefined>(o: T, key: string, defaultValue?: V): V;
function f<T, V = undefined>(o: T, key: string, defaultValue?: V) {
  return o[key] || defaultValue;
}

const obj = { foo: "123" };

const definitelyUndefined = f(obj, "bar");    // type: undefined
const definitelyNumber = f(obj, "bar", 123);  // type: number
const definitelyString = f(obj, "foo");       // type: string

While this solution may not cover every conceivable scenario (as the return type relies on the generic type argument rather than the actual function argument), it does come remarkably close.

Answer 3

Answer №2

The provided answer incorrectly combines 'type space' and 'value space' together, which was pointed out in one of the comments.
To address this issue, here is an improved solution:

Typescript >= 4.7.4

// Type definition
type ValueOrUndefined<T> =
  T extends (string | number | boolean | symbol | object) ? T : undefined;

// Function definition
function getValueOrUndefined<T>(defaultValue?: T): ValueOrUndefined<T> {
  return defaultValue as any;
}

// Examples
const resultUndefined = getValueOrUndefined();      // type: undefined
const resultString = getValueOrUndefined('text'); // type: string

Typescript < 4.7.4

// Type definition
type ValueOrUndefined<T> =
  T extends (string | number | boolean | symbol | object) ? T : undefined;

// Function definition
function getValueOrUndefined<T>(defaultValue?: T): ValueOrUndefined<typeof defaultValue> {
  return defaultValue as any;
}

// Examples
const resultUndefined = getValueOrUndefined();      // type: undefined
const resultString = getValueOrUndefined('text'); // type: string

Answer 4

The provided answer incorrectly combines 'type space' and 'value space' together, which was pointed out in one of the comments.
To address this issue, here is an improved solution:

Typescript >= 4.7.4

// Type definition
type ValueOrUndefined<T> =
  T extends (string | number | boolean | symbol | object) ? T : undefined;

// Function definition
function getValueOrUndefined<T>(defaultValue?: T): ValueOrUndefined<T> {
  return defaultValue as any;
}

// Examples
const resultUndefined = getValueOrUndefined();      // type: undefined
const resultString = getValueOrUndefined('text'); // type: string

Typescript < 4.7.4

// Type definition
type ValueOrUndefined<T> =
  T extends (string | number | boolean | symbol | object) ? T : undefined;

// Function definition
function getValueOrUndefined<T>(defaultValue?: T): ValueOrUndefined<typeof defaultValue> {
  return defaultValue as any;
}

// Examples
const resultUndefined = getValueOrUndefined();      // type: undefined
const resultString = getValueOrUndefined('text'); // type: string

Determining the output type by considering the presence of optional parameters

Overview

Answer №1

Answer №2

Similar questions

What is the process for performing type checking on a block of TypeScript code stored in memory?

I lost my hovering tooltip due to truncating the string, how can I bring it back in Angular?

Get rid of the strange border on the material dialog

Having trouble with the removeEventListener OnDestroy not functioning properly in Angular 6 using Javascript?

The type 'Store<unknown, AnyAction>' is lacking the properties: dispatch, getState, subscribe, and replaceReducer

What is the equivalent of a "Class" in Typescript for defining an "Interface"?

"Capture input value changes and display the previous value when submitting a post. See an example of

Establish a connection between two pre-existing tables by utilizing the Sequelize framework

`The Art of Curved Arrows in sigjma.js, typescript, and npm`

Issue with react-router-dom loader defer type issue

There is a WARNING occurring at line 493 in the file coreui-angular.js located in the node_modules folder. The warning states that the export 'ɵɵdefineInjectable' was not found in the '@angular/core' module

Discovering a specific property of an object within an array using Typescript

What is the process of creating an asynchronous function that will resolve a promise when the readline on('close') event is triggered within it in Typescript?

Creating circular artwork with PixiJS: A step-by-step guide

Increasing a number after a delay in an Angular 2 AppComponent using TypeScript

A Guide to Iterating Through Arrays of Objects Using TypeScript

Sort the observable data by a value returned from an API request

Unable to provide any input while utilizing npm prompts

Creating nested Angular form groups is essential for organizing form fields in a hierarchical structure that reflects

Find a string that matches an element in a list