I still new to typescript and types in general, but this error is really confusing me. I am using the npm modules query-string to parse a query string into a object of key/value pairs. But i am not sure what the best way of type setting the return value. query-string using the .parse() method will either return a object of key/value pairs OR a empty object.

Example:

queryString: { date: string } | {} =  queryString.parse(location.search);

When i trying to accessing a property using queryString.date i get this error: Property 'date' does not exist on type '{} | { date: string; }'

I am sure i am missing something basic here i just can't figure it out.

I still new to typescript and types in general, but this error is really confusing me. I am using the npm modules query-string to parse a query string into a object of key/value pairs. But i am not sure what the best way of type setting the return value. query-string using the .parse() method will either return a object of key/value pairs OR a empty object.

Example:

queryString: { date: string } | {} =  queryString.parse(location.search);

When i trying to accessing a property using queryString.date i get this error: Property 'date' does not exist on type '{} | { date: string; }'

I am sure i am missing something basic here i just can't figure it out.

• javascript
• typescript
• query-string

4 Answers 4

When you are trying to access the property; transpiler does not know if you want to use the object as an empty object or the object with date.

There are several ways to tackle the issue:

1: queryString: { date?: string } = queryString.parse(location.search); It will, in essence, mean that the object can have the date property but it is not necessary. Use this in case you want to have queryString.date to be either proper date or undefined

2: Surround your usage with if It's as simple as that.

if(queryString.date !== undefined) {
   const date = queryString.date;
   //... Do stuff
}

3: (Not advised) If for any other reason you are just not interested if it's there or not, you can force transpiler to treat it as one or the other by as keyworord

const myDate: Date = (queryString as {date: Date}).date

Just make date an optional property.

queryString: { date?: string } =  queryString.parse(location.search);

Your are declaring the queryString property also as an empty object {}. And simply sayed, {} has no property date.

Don't set anything -- TypeScript will infer the type automatically based on the return value.

queryString =  queryString.parse(location.search);

And what TypeScript is telling is true. If something is either {} or {date: string}, there's no guarantee that .date will exist. TypeScript respects that and errors out appropriately. It's desired behavior.