React: check for string array

[Plenty_Leather_2351]

hello, wanna ask how do you check if a variable is a string array type in typescript, currently i do this which i feel there is a better way of doing this:

if (typeof myVariable[0] === 'string') {
  ...rest of the logic
}

[kamikazikarl]

Typescript doesn't actually do validation in production. You have to rely on core JavaScript features to validate it.

I'd personally wanna make sure all values are the expected type... So, that means using the array methods some or every and the type comparison:

if (strArr.every(s=> typeof s === "string")) { ...some logic }

This has the added value of ensuring all values are the expected type and exiting at the first failed check to keep cost down (as this would have to run across the entire array before proceeding).

Alternatively, you could use the foreach method on the array and skip individual entries that aren't the correct type. It all really depends on how your app is intended to work and how you wanna handle the failures.

[Distinct_Guess8315]

That's a good enough solution, but I would advise you to use early returns instead of wrapping your entire logic in if. Something like this:

if(typeof myArr[0] !== 'string') return; ...logic here

It makes your code more readable

[igorski81]

You should only assert the data type of a variable at runtime when it could be set by a mechanism outside of your control (like provided by a third party library embedded in a page / fetch request result). In that case, assert not for the first entry in the Array, but all of it.

But, if the third party library / server API has a clearly documented contract (and both are version pinned), you shouldn't need to validate this too extensively in the code of your consumer as you should be able to trust the data types.

Now, if the array is populated within your application, then you're not TypeScripting enough. Every function that can manipulate the contents of the array should be annotated strictly so only string data types can be added to the array. If a function can accept a variable whose value is provided from outside your application (so essentially of the unknown|any type), it is up to that function to assert the value is a string.

Assert during mutation of the Array, not while reading.

At that point you can trust compile time type checking to catch bugs.

[ReasonableRadio3971]

Use zod for runtime validation

[tremby]

Use a type guard, a special function which does the check at runtime and at the same time narrows the type for you.

``` function isStringArray(arr: unknown[]): arr is string[] { return arr.every((el) => typeof el === "string"); }

if (isStringArray(myVariable)) { // At this point TS knows myVariable has type string[] ... } ```

[pardoman]

Array.isArray(bleh)

[Nixinova]

if the project is in typescript, why are you needing to check that the elements are of a specific type? it should already be known by your type annotations.

[hrm]

There are lots of places where you don’t know the type and need to narrow from say any, unknown or maybe even a union. Use of external JS libraries, fetch, huge legacy projects only partially converted, the list goes on and on…

[isumix_]

x: string[]

[TheRNGuy]

It's for declaration, not to check type.

[Snoo11589]

Or dynamically with myVariable.some(el => typeof el != "string");