How can I suggest the return type of a function that is out of my control?

Question

How can I suggest the return type of a function that is out of my control?

When I attempt to parse a JSON-formatted string, a linter error is triggered:

let mqttMessage = JSON.parse(message.toString())

// ESLint: Unsafe assignment of an `any` value. (@typescript-eslint/no-unsafe-assignment)

Given that I am in control of the content of message, I'm interested in explicitly informing TypeScript that the result of JSON.parse() is actually an Object. Is there a recommended approach for achieving this?

Please note that although I could suppress the warning, I prefer to explore alternative solutions to address the issue.

json typescript eslint type-assertion

Answer 1

Answer №1

One issue is that when using JSON.parse, it returns a type of any.

This makes sense because TypeScript cannot determine if the parsed result will be a string, number, or object.

Your linting rule advises against assigning variables as 'any'.

One way to handle this is by coercing the result of JSON.parse:

type SomeObjectIKnowAbout = {

}; 
const result = JSON.parse(message.toString()) as SomeObjectIKnowAbout;

A better approach in such cases would be to create a dedicated parsing function that validates the shape of the object at runtime and performs the necessary type casting for easier handling:

type SomeObjectIKnowAbout = {
    userId: string; 
}

type ToStringable = {
    toString: () => string; 
}

function parseMessage(message: ToStringable ) : SomeObjectIKnowAbout {
    const obj = JSON.parse(message.toString()); //It is unclear why you are parsing after calling toString.

    if (typeof obj === 'object' && obj.userId && typeof obj.userId === 'string') {
        return obj as SomeObjectIKnowAbout; 
    }
    else {
        throw new Error ("message was not a valid SomeObjectIKnowAbout"); 
    }
}

Answer 2

One issue is that when using JSON.parse, it returns a type of any.

This makes sense because TypeScript cannot determine if the parsed result will be a string, number, or object.

Your linting rule advises against assigning variables as 'any'.

One way to handle this is by coercing the result of JSON.parse:

type SomeObjectIKnowAbout = {

}; 
const result = JSON.parse(message.toString()) as SomeObjectIKnowAbout;

A better approach in such cases would be to create a dedicated parsing function that validates the shape of the object at runtime and performs the necessary type casting for easier handling:

type SomeObjectIKnowAbout = {
    userId: string; 
}

type ToStringable = {
    toString: () => string; 
}

function parseMessage(message: ToStringable ) : SomeObjectIKnowAbout {
    const obj = JSON.parse(message.toString()); //It is unclear why you are parsing after calling toString.

    if (typeof obj === 'object' && obj.userId && typeof obj.userId === 'string') {
        return obj as SomeObjectIKnowAbout; 
    }
    else {
        throw new Error ("message was not a valid SomeObjectIKnowAbout"); 
    }
}

Answer 3

Answer №2

JSON.parse is not a one-size-fits-all solution, so providing a generic argument is not possible.

You have a couple of choices to consider.

A straightforward approach would be to specify the type of the variable that you are assigning the result of JSON.parse to, since it returns any:

let mqttMessage: MQTTMessage = JSON.parse(message.toString());

(I've used MQTTMessage as an example type.)

However, this method may not be robust enough for all cases, as it assumes the string contains the expected data type and may necessitate repeated assumptions elsewhere in your code.

Alternatively, you could create a function:

function parseMQTTMessageJSON(json: string): MQTTMessage {
    const x: object = JSON.parse(json);
    if (x && /*...appropriate checks for properties here...*/"someProp" in x) {
        return x as MQTTMessage;
    }
    throw new Error(`Incorrect JSON for 'MQTTMessage' type`);
}

Then you can use the function in your code like this:

let mqttMessage = parseMQTTMessageJSON(message.toString());

Answer 4

JSON.parse is not a one-size-fits-all solution, so providing a generic argument is not possible.

You have a couple of choices to consider.

A straightforward approach would be to specify the type of the variable that you are assigning the result of JSON.parse to, since it returns any:

let mqttMessage: MQTTMessage = JSON.parse(message.toString());

(I've used MQTTMessage as an example type.)

However, this method may not be robust enough for all cases, as it assumes the string contains the expected data type and may necessitate repeated assumptions elsewhere in your code.

Alternatively, you could create a function:

function parseMQTTMessageJSON(json: string): MQTTMessage {
    const x: object = JSON.parse(json);
    if (x && /*...appropriate checks for properties here...*/"someProp" in x) {
        return x as MQTTMessage;
    }
    throw new Error(`Incorrect JSON for 'MQTTMessage' type`);
}

Then you can use the function in your code like this:

let mqttMessage = parseMQTTMessageJSON(message.toString());

Answer 5

Answer №3

Instead of relying on type assertions and runtime wrapper functions, you have the option to employ declaration merging to enhance the global JSON object with a generic overload for the parse method. This enhancement allows you to specify the expected type and get better IntelliSense support if you utilize a reviver during parsing:

interface JSON {
    parse<T = unknown>(text: string, reviver?: (this: any, key: keyof T & string, value: T[keyof T]) => unknown): T
}

type Test = { a: 1, b: "", c: false };

const { a, b, c } = JSON.parse<Test>(
    "{\"a\":1,\"b\":\"\",\"c\":false}",  
    //k is "a"|"b"|"c", v is false | "" | 1
    (k,v) => v
);

Alternatively, if you prefer using declaration files to extend global interfaces:

declare global {
  interface JSON {
    parse<T = unknown>(text: string, reviver?: (this: any, key: keyof T & string, 
  value: T[keyof T]) => unknown): T
  }
}

Playground

Answer 6

Instead of relying on type assertions and runtime wrapper functions, you have the option to employ declaration merging to enhance the global JSON object with a generic overload for the parse method. This enhancement allows you to specify the expected type and get better IntelliSense support if you utilize a reviver during parsing:

interface JSON {
    parse<T = unknown>(text: string, reviver?: (this: any, key: keyof T & string, value: T[keyof T]) => unknown): T
}

type Test = { a: 1, b: "", c: false };

const { a, b, c } = JSON.parse<Test>(
    "{\"a\":1,\"b\":\"\",\"c\":false}",  
    //k is "a"|"b"|"c", v is false | "" | 1
    (k,v) => v
);

Alternatively, if you prefer using declaration files to extend global interfaces:

declare global {
  interface JSON {
    parse<T = unknown>(text: string, reviver?: (this: any, key: keyof T & string, 
  value: T[keyof T]) => unknown): T
  }
}

Playground

How can I suggest the return type of a function that is out of my control?

Answer №1

Answer №2

Answer №3

Similar questions

What is the process for implementing custom color props with Material-UI v5 in a React TypeScript project?

Set up a Pinia store with a specific data type

Combining JSON payload values into an object

How can I effectively store nested JSON data in a SQL Server database?

Working with JSON data and extracting specific information within the grades

Error: The module parsing process failed due to the presence of an octal literal in strict mode. To resolve this issue,

What is the best way to iterate through my array of objects using a forEach loop and assign a value to the property of any object that has an empty string?

Can we use a switch statement instead of having multiple @Input()s in Angular?

Encounter an error parsing the package.json file. Confirmed that it is valid JSON

Step-by-step guide on importing Nano (CouchDB) using Typescript

Leveraging the capabilities of NodeJS, enhance your Winston file transport feature with

Perform an action after the Ngx Bootstrap modal has been hidden

Querying JSON values in Postgres can be done using the JSON

Struggling with utilizing data encoded by PHP into JSON format when working with JavaScript to showcase graphs using the chart.js library

Break apart each item in the loop and create a fresh array

Encoding JSON and parsing data in case no results are retrieved

Error occurred while parsing the HTTP GET response (possible empty String?) - however, the body contains data

Rspec's include matcher is a useful tool for checking the presence of elements within Hash and String objects

Comparing dates and times with Python by utilizing JSON information

What is the best way to create a dynamic icon using React and TypeScript?