Map LocalStorage to Interface

I'm retrieving an object from local storage:

 retrieveToken(): JwtToken {
   return JSON.parse(localStorage.getItem(_key));
 }

I need to map the data stored in local storage to my interface

export interface JwtToken {
  access_token: string;
  expires_in: number;
  token_type: string;
  refresh_token: string;
}

I've tried:

return JSON.parse(localStorage.getItem(_key) as JwtToken);

return JSON.parse<JwtToken>(localStorage.getItem(_key));

Any help would be appreciated

You're performing your cast on the string value retrieved from storage instead of casting the result of JSON.parse().

It should be:

return JSON.parse(localStorage.getItem(_key)) as JwtToken;

To get rid of the error caused by the fact that localStorage.getItem() potentially returns null, you can add a non-null assertion to convince the compiler that the value for _key will definitely be present in localStorage:

return JSON.parse(localStorage.getItem(_key)!) as JwtToken;

Or, better yet, perform an explicit null check:

const jwtTokenString = localStorage.getItem(_key);

if (jwtTokenString) {
    return JSON.parse(jwtTokenString) as JwtToken;
}