Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to let typescript know the variable must be a string, but not undefine without faking?

I have a state, interface , and a function that process the API data

  • const [series, setSeries] = useState<ISeries[]>([])

export interface ITicket {
  status?: string
  status_desc?: string
  keyword_language?: string
}

interface ISeries {
  colorByPoint: boolean
  data: {
    name: string
    y: number
    status: string | undefined
    keyword_language: string | undefined
  }[]
}

function that process the api Data

function trans(series: ITicket[]) {

  const data = series.map(s => {

    return {
**//api only reuturn either s.status_desc or s.keyword_language, only one** 
      name: s.status_desc ? s.status_desc : s.keyword_language,
      y: s.ticket_count,
      status: s?.status,
      keyword_language: s?.keyword_language,

    }
  })

  return [
    {
      colorByPoint: true,
      data,
    },
  ]
}

In the function that process the API data, I am checking what value was passed in order to set the name property.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

    return {
**//api only reuturn either s.status_desc or s.keyword_language, only one** 
      name: s.status_desc ? s.status_desc : s.keyword_language, 

But then I get a TypeScript compilor error that it is not assignable since name must be a string. Now there is chance that it can be undefined.

Question:

I am sure that API will pass either s.status_desc or s.keyword_language as a string. So name will get a string value to assign.

I dont want to change the type for name to string | undefined

I don’t want to use TypeScript ignore (@ts-ignore) to by pass the error.

How can I get rid of the error without faking?

bear in mind: in the interface, I cant change the type of status_desc and keyword_language in order to bypass it because API could either pass me one. So I have to keep the type as undefined for both cases

>Solution :

Simplest way: name: s.status_desc || s.keyword_language || ""

console.log(null || undefined || "" || "asd" || ""); will print "asd"

return {
    name: s.status_desc || s.keyword_language || "",
    y: s.ticket_count,    
    status: s.status,
    keyword_language: s?.keyword_language,
}

So if by any chance both fields are null or undefined – your code will not fail with error trying to access null field name (it will be an empty string)

Or you can use Non-Null Assertion Operator !:

Considered as a bad practice but can help anyway.

name: s.status_desc! || s.keyword_language!
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading