How to define a simple array of strings in TypeScript

Question

I got a state in React of an Array of strings.

I get no errors when doing this:

const [arr, setArr] = useState<Array<string>>([])

const addFilter = (e: React.ChangeEvent<HTMLInputElement>) => {
   const value = e.target.value
   setArr([...arr, value])
}

But how do you define the type with Type or Interface ?

Answer 1

If you want to create an alias for a string array, you can do that using a type:

type StringArray = string[];

const arr: StringArray = [
    'a',
    'b',
    167, // error
    'c'
]

If you want the array + set tuple, it's a similar technique:

type StringArrayAndSet = [string[], Set<string>];

const arrAndSet: StringArrayAndSet = [
    ['a', 'b', 'b', 'c'],
    new Set(['a', 'b', 'b', 'c'])
];