Pfthb

With Typescript 3.1 I have got a following piece of code

type Variable = string | File;

function isFile(variable: Variable): variable is File 
 return (variable as File).name !== undefined;


function getFileFromVariables(entity: EntityInterface) 
 return isFile(this.state.variables[entity.variable])
 ? this.state.variables[entity.variable]
 : undefined;


const file = getFileFromVariables(someEntity);

Unfortunately, I don't know why the file is
const file: string | File | undefined
instead of const file: File | undefined

Could someone tell me why it's like this and how may I fix it?

TypeScript isn't able to link together two instances of this.state.variables[entity.variable] - one that is passed into type guard and another used afterwards. For it, this is two unrelated queries into array, since entity.variable could be very well changed by some undercover process (or even by the type guard, if it is in the same scope), and type system isn't able to catch that.

A common workaround is to use the temporary variable:

type Variable = string | File;

function isFile(variable: Variable): variable is File 
 return (variable as File).name !== undefined;


function getFileFromVariables(entity: EntityInterface) 
 const variable = this.state.variables[entity.variable];
 return isFile(variable) ? variable : undefined;


const file = getFileFromVariables(someEntity);

Side note: try to provide a self-contained example, in other words, an MCVE. Your code was impossible to check, since we don't know neither what EntityInterface interface looks like nor what is this or this.state. My answer is assuming that this.state.variables is of type Variable and EnintyInterface extends variable: number, and it's enough for the code provided to give you the result you ask, but please, don't force us to do this assumptions.

Your question is pretty vague.

Other than that, all the problems you are encountering are from non-strict mode and some other poor practices. I suggest you the following:

• Add "strict": true to compilerOptions of tsconfig.json (at least temporarily, until you figure out the solution to your problem)


• Define explicitly what you want to get from a function e.g. getFileFromVariables(...): File | undefined


• If possible, don't use classic functions for such cases. Instead define a type type GetFileFromVariables = (ent: EntityInterface) => File | undefined, then const getFileFromVariables: GetFileFromVariables = () => ...
  

Then everything instantly becomes much clearer to you.