Creating an array type in typescript

Question

I created an array type in typescript which looks like this

export type RamenApi = [
    {
        "Brand": string,
        "Variety": string,
        "Style": string,
        "Country": string,
        "Stars": number,
        "Top Ten": string
    }
]

Now, In one of the places, where I am sorting and filtering the array, I am getting the following error

Property '0' is missing in type '{ "Brand": string; "Variety": string; "Style": string; "Country": string; "Stars": number; "Top Ten": string; }[]' but required in type 'RamenApi'

Any idea on why I am getting the following error and how I can fix it?

  type Props = {
        searchData: RamenApi, 

    const [filteredSearch, setFilteredSearch] = useState<RamenApi | null>(null)


 const {searchData} = props
            const tempFilteredSearch = []
                for (let i=0; i<searchData.length; i++) {
                    const currentResponse = searchData[i]
                    const searchVariable = currentResponse["Variety"].toLowerCase() + currentResponse["Brand"].toLowerCase() + currentResponse["Country"]
                    if (searchVariable.indexOf(text) > - 1) {
                        tempFilteredSearch.push(currentResponse)
                    }
                }
                setFilteredSearch(tempFilteredSearch.slice(0,5))

This is where I am getting error setFilteredSearch(tempFilteredSearch.slice(0,5)). Also, the code is cut short. ignore missing brackets or any such mistakes

There is no possible way anyone can answer this question without seeing the code which that error message refers to. Please write a [mcve]. — kaya3, Mar 08 '20 at 17:05
The type you defined means "An array that contains one element and this element is an object with fields: "Brand" of type string, "Variety" ...". But than you are trying to set an array with multiple items to the state of your type — Shlang, Mar 08 '20 at 17:10
@Shlang Okay, So how I can create my type to have multiple items? — Alwaysblue, Mar 08 '20 at 17:12
I'm not sure I understand what you want to achieve. If you just want to have an array of strings it is `string[]`, if you want to ensure only limited set of string values can be put to the array it is `("Brand" | "Variety" ...)[]`. — Shlang, Mar 08 '20 at 17:15
@anny123 The syntax for array types is `T[]` or `Array`. `[T]` is a tuple with one element of type `T` — p4m, Mar 08 '20 at 17:49

score 1 · Accepted Answer · answered Mar 08 '20 at 17:16

The shape of a type or a type interface will be and most likely the same as the object in that array.

Create something like this

export type RamenApi = {
        Brand: string,
        Variety: string,
        Style: string,
        Country: string,
        Stars: number,
        TopTen: string
    }

Then

searchData: RamenApi[], 

const [filteredSearch, setFilteredSearch] = useState<RamenApi[] | null>(null)

score 0 · Answer 2 · answered Mar 08 '20 at 17:14

I assume there s a typo. What is declared there - is a type that ALWAYS have a SINGLE item for specified structure.

I may assume the intent was to declare array that MAY have from 0 to N items of defined structure, then the syntax should be like this:

export type RamenApi = {
    "Brand": string,
    "Variety": string,
    "Style": string,
    "Country": string,
    "Stars": number,
    "Top Ten": string
}[]

Creating an array type in typescript

2 Answers2