Verify in Typescript if there is at least one value supplied

Question

Verify in Typescript if there is at least one value supplied

Looking for a solution:

function takeOneOfOrThrow(firstOptionalVariable : string | undefined, secondOptionalVariable : string | undefined) {
    let result : string; 

    if (!firstOptionalVariable && !secondOptionalVariable) {
        throw new Error('both are undefined'); 
    } 
    result = firstOptionalVariable ? firstOptionalVariable : secondOptionalVariable; 
};

Check out the code in this playground: https://tsplay.dev/mxJoxw.

The two variables can be either strings or undefined. The first "if" statement ensures that at least one of them is a non-empty string. So, why does TypeScript give an error stating

Type 'string | undefined' is not assignable to type 'string'

? What would be the correct approach to solve this issue?

typescript

Answer 1

Answer №1

The compiler cannot determine the types based on your condition.

Your condition is checking if both variables are undefined, but even if one of them is not undefined, there is no way for the compiler to accurately infer the correct type for them. It wouldn't make sense to assign both as string since that's not what the condition is checking for. The compiler also cannot infer only one as string because it won't know until runtime which one will not be empty. This lack of a clear relationship between variables causes the error when trying to assign to a variable.

One solution is to use the non-null assertion operator as mentioned in another answer. However, it is advisable to avoid using it because if the function body changes and the condition is removed, the compiler won't detect any errors.

A simple alternative is to set a default value if both variables are empty, assuming that the default value won't be used due to the condition:

result = first ?? second ?? ''

Alternatively, you can utilize if/else blocks:

function takeOneOfOrThrow(firstOptionalVariable: string | undefined, secondOptionalVariable?: string | undefined) {
    let result: string;

    if (!firstOptionalVariable && !secondOptionalVariable) {
        throw new Error('both are undefined');
    }
    else if (firstOptionalVariable) {
        result = firstOptionalVariable;
    } else if (secondOptionalVariable) {
        result = secondOptionalVariable
    }
};

Answer 2

The compiler cannot determine the types based on your condition.

Your condition is checking if both variables are undefined, but even if one of them is not undefined, there is no way for the compiler to accurately infer the correct type for them. It wouldn't make sense to assign both as string since that's not what the condition is checking for. The compiler also cannot infer only one as string because it won't know until runtime which one will not be empty. This lack of a clear relationship between variables causes the error when trying to assign to a variable.

One solution is to use the non-null assertion operator as mentioned in another answer. However, it is advisable to avoid using it because if the function body changes and the condition is removed, the compiler won't detect any errors.

A simple alternative is to set a default value if both variables are empty, assuming that the default value won't be used due to the condition:

result = first ?? second ?? ''

Alternatively, you can utilize if/else blocks:

function takeOneOfOrThrow(firstOptionalVariable: string | undefined, secondOptionalVariable?: string | undefined) {
    let result: string;

    if (!firstOptionalVariable && !secondOptionalVariable) {
        throw new Error('both are undefined');
    }
    else if (firstOptionalVariable) {
        result = firstOptionalVariable;
    } else if (secondOptionalVariable) {
        result = secondOptionalVariable
    }
};

Verify in Typescript if there is at least one value supplied

Answer №1

Similar questions

Is there a way to inform TypeScript that an object can only return properties from values found within an array?

What is the process of converting TypeScript to JavaScript in Angular 2?

Looking for a way to toggle the visibility of a dropdown list when clicking on an input in Angular7?

Testing the NestJS service with a real database comparison

Form for creating and updating users with a variety of input options, powered by Angular 2+

Limiting the parameter type in Node.js and TypeScript functions

Retrieving the value of an object using an array of keys

I am experiencing an issue with my date filter where it does not display any results when I choose the same date for the start and end dates. Can anyone help me troub

I'm having some trouble with my middleware test in Jest - what could be going wrong?

Is it possible to utilize instanceof to verify whether a certain variable is of a class constructor type in TypeScript?

Issue deploying serverless: Module '/Users/.../--max-old-space-size=2048' not found

The issue arises when using NestJs with Fastify, as the code does not continue executing after the app.listen()

What are the steps to enable generators support in TypeScript 1.6 using Visual Studio Code?

Ways to restrict users from inputting alphabets in TextField using material ui

Please come back after signing up. The type 'Subscription' is lacking the specified attributes

MaterialUI Divider is designed to dynamically adjust based on the screen size. It appears horizontally on small screens and vertically on

What is the best way to implement a switch case with multiple payload types as parameters?

I am attempting to gather user input for an array while also ensuring that duplicate values are being checked

Navigating back to the login page in your Ionic V2 application can be achieved by utilizing the `this.nav

Return the subclass from the constructor function