How to tell TypeScript there is no undefined in Array?

Question

I have the error: Type (string | undefined)[] is not assignable to type string | string[] | undefined, because my function this.errors get the type string | string[] | undefined. But before to return the array I filtered it with undefined. It means there is no undefined. And the value can be string or undefined. The definition of setErrors return array of errors. This is my error:

This is my function:

    this.setErrors(() => {
      const errors = validators.map(val => val(this.inputValue));
      const filteredErrors = errors.filter(el => el);

      return filteredErrors && filteredErrors.length !== 0 ? filteredErrors : undefined;
    });

Validators:

const REGEXP_UPPERCASE = /[A-Z]/;
const REGEXP_LOWERCASE = /[a-z]/;
const REGEXP_ONE_DIGIT = /.*[0-9].*/;

export const newPasswordValidators = (args: { min: number; max: number }) => {
  const { min, max } = args;
  return {
    minMaxLength: (value?: string) => value && value.length < min || value.length > max ? 'Not valid length' : undefined,
    requiredToFill: (value?: string) => !value ? 'Required to fill.' : undefined,
    uppercaseLetter: (value?: string) => value && !REGEXP_UPPERCASE.test(value) ? 'Use at least one uppercase letter.' : undefined,
    lowercaseLetter: (value?: string) => value && !REGEXP_LOWERCASE.test(value) ? 'Use at least one lowercase letter.' : undefined,
    atLeastOneDigit: (value?: string) => value && !REGEXP_ONE_DIGIT.test(value) ? 'Use at least one digit.' : undefined,
  };
};

Super class method:

  public setErrors(errors: string | string[] | undefined | (() => (string | string[] | undefined))) {
    this._errors = errors;
  }

Can you tell me please how can I get rid from this error?

What is validators? What is this.inputValue? What is the definition of this.setErrors? — T.J. Crowder
– T.J. Crowder, Commented Aug 6, 2020 at 6:56
Can't return filteredErrors && filteredErrors.length !== 0 ? filteredErrors : undefined; be just be return filteredErrors.length !== 0 ? — Gaotter
– Gaotter, Commented Aug 6, 2020 at 7:05
@jocoders, you still need to add the definition of this.setErrors and validators — Aluan Haddad
– Aluan Haddad, Commented Aug 6, 2020 at 7:06
Validators check the string, setErrors came from the super class — jc28
– jc28, Commented Aug 6, 2020 at 7:11
As I see, you go through validators via map(). Your validators can return undefined or string with error. It looks like TS filter typing is not smart enough, so you still have (string | undefined)[] after its run. So the best option is typecasting until it's fixed. — Pavlo Zhukov
– Pavlo Zhukov, Commented Mar 11, 2022 at 16:50

Zer0 · Accepted Answer · 2020-08-06 07:06:39Z

1

Did you ever hear of typecasting (to be exact, it's more a type assertion in TS due to JS' dynamic nature)? Sounds like this is what you need here, there are two ways to do it which produce basically the same result:

const x: string[] = <string[]>strAndUndefinedArr;
const y: string[] = strAndUndefinedArr as string[];

This works everywhere, you can also do stuff like

functionCall(<string[]>arr); //or functionCall(arr as string[])

You can read more on this here

answered Aug 6, 2020 at 7:06

Zer0

1,7102 gold badges15 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Aluan Haddad Over a year ago

If you are going to resort to this for such a common error, why use TypeScript? Who knows the runtime errors you are suppressing?

captain-yossarian from Ukraine · Accepted Answer · 2020-08-06 07:11:30Z

1

As far as I understand, you have two values:

const foo: (string | undefined)[] | undefined = 'hello foo';
const bar: string | string[] | undefined = 'hello bar';

As You may have noticed, variable bar can be string, whereas variable foo can't. variable foo can be an array of strings or undefineds or undefined at all.

Simplier example:

const fn = (arg: string)=>arg;
const result = fn(undefined) // error;

You cant pass undefined to function which expects string

I think you should adjust your types or allow one of your values to be a string type; Please keep in mind, you can use any type or as operator, but it is a cheating.

answered Aug 6, 2020 at 7:11

captain-yossarian from Ukraine

33.5k5 gold badges41 silver badges78 bronze badges

2 Comments

jc28 Over a year ago

But I don't do it, because I filtered an array for undefined before to return in. There is no undefined in the array

captain-yossarian from Ukraine Over a year ago

Could you please share working example of your code in any online sandbox? It will be much easier to figure out whats going on here

Collectives™ on Stack Overflow

How to tell TypeScript there is no undefined in Array?

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related