'How to avoid this kind of notation " | undefinded " in typescript?

It's not essential, but I'm asking out of curiosity. In Object type we can declare optional property by using ?: operator, but is there a similar shorthand when I want to declare the function return type?

type Type = string | number;

const foo = (): Type | undefined => {
 
  ...

  return;
};


Solution 1:[1]

Just a heads up: ? (optional property) and | undefined are slightly different. foo?: number means that the property foo may not exist at all on instances of the type. 'foo' in instance for example, will return false. foo: number | undefined, however, requires that the foo is defined on the instance, even if its value is undefined.

There is no shorthand for this (that I know of or can find), but to avoid writing the union each time, and to improve the semantics, you can create a type to represent it. You can also make specific versions of this type, which can be useful, especially for nested generic types.
I have seen this pattern used in several real-world projects (VueUse, for example).

type Maybe<T> = T | undefined
type MaybeNumber = Maybe<number>
type MaybeArray<T> = Maybe<T[]>
type ArrayOfMaybe<T> = Maybe<T>[]

// Example use with variables:

let maybe: Maybe<string> = "Hello, world" // or `undefined`
let maybeNumber: MaybeNumber = 42 // or `undefined`
let maybeNumberArray: MaybeArray<number> = [1, 2, 3, 4] // or `undefined`
let arrayOfMaybeStrings: ArrayOfMaybe<string> = ["abc", undefined, "foo"]

It's generally simplest to just use the Maybe type directly. The only cases where it's really beneficial to create a new type based on it is if it is widely used and/or more complex (e.g. unions and such).

Rambling and thoughts
The semantics of a shorthand like ?: would actually be nice for function return signatures, as you could semantically differentiate between "this function might return undefined as a value, and this is meaningful" (f(): T | undefined) and "this function might not return a meaningful value" (f()?: T). Of course, the fact that the function returned undefined instead of a value of type T must mean something, but the value undefined itself is not the point in that case, it is that no other value was returned.

Solution 2:[2]

No returning undefined is an option also. You can return the default value.

const foo = (): Type => {
  let result: type = defaultValue;
  ...

  return result || defaultValue;
};

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Saeed Sharman