Ensure thorough validation of the JSON.parsed data in TypeScript

Question

Ensure thorough validation of the JSON.parsed data in TypeScript

Currently, I am developing a small module for Angular and I have encountered an issue regarding the condition where I verify my JSON.parsed data.

read(): Position|null {
    try {
        ...
        let parsedData  = JSON.parse(data);
        if (parsedData && parsedData.x && parsedData.y)
            return new Position(parsedData.x, parsedData.y);
    } catch (e) {
        ...
    }
    return null;
}

I find this solution to be suboptimal as it would require me to check for each property if there are more properties in the object that I had previously stringified. Additionally, I am unsure about how to handle cases when the parsed data is null. Are there any alternative solutions for validating the stringified data? Thank you

angular typescript if-statement conditional-statements javascript-objects

Answer 1

Answer №1

To transform your json output into a Position instance, all you need to do is cast it in the following manner:

read(): Position|null {
    try {
        return JSON.parse(data) as Position;
    } catch (e) {
        return null;
    }
}

Nevertheless, casting alone does not validate the data structure. It does not verify if the json contains the expected fields of the Position object. To ensure this, manual validation of each field is necessary.

An approach to achieve this could involve maintaining a list of properties within the class and then checking for their existence post-casting:

class Position {
    public x: Number;
    public y: Number;
    public someOtherField: string;
    
    public static PropertyNames: string[] = ["x", "y", "someOtherField"];
    public static isValid(pos: Position): Boolean {
        return Position.PropertyNames.every((i) => pos && pos.hasOwnProperty(i));
    }
}

let obj = new Position();
alert(Position.isValid(obj)); //false

obj.x = null;
obj.y = null;
obj.someOtherField = null;

alert(Position.isValid(obj)); //true

Answer 2

To transform your json output into a Position instance, all you need to do is cast it in the following manner:

read(): Position|null {
    try {
        return JSON.parse(data) as Position;
    } catch (e) {
        return null;
    }
}

Nevertheless, casting alone does not validate the data structure. It does not verify if the json contains the expected fields of the Position object. To ensure this, manual validation of each field is necessary.

An approach to achieve this could involve maintaining a list of properties within the class and then checking for their existence post-casting:

class Position {
    public x: Number;
    public y: Number;
    public someOtherField: string;
    
    public static PropertyNames: string[] = ["x", "y", "someOtherField"];
    public static isValid(pos: Position): Boolean {
        return Position.PropertyNames.every((i) => pos && pos.hasOwnProperty(i));
    }
}

let obj = new Position();
alert(Position.isValid(obj)); //false

obj.x = null;
obj.y = null;
obj.someOtherField = null;

alert(Position.isValid(obj)); //true

Ensure thorough validation of the JSON.parsed data in TypeScript

Answer №1

Similar questions

Steps for ensuring a prop is required in TypeScript React based on a condition

Retrieving Response Status Codes with Angular 4 and Express

Firebase login success callback not getting invoked

Find out if all attributes of the object are identical

Steps to validate the execution of the ngCopy function in an Angular 6 unit test

Why is interpolation not allowed in Angular 2 for binding to my child component?

What is the recommended TypeScript type to be returned from a GraphQL resolver when using ESLint?

How to outsmart the TypeScript compiler when integrating a library without type definitions?

Having trouble with the Ng multiselect dropdown displaying empty options?

How come this constant can be accessed before it has even been declared?

Is there a way to obtain the coordinates of an SVG element by simply clicking on a specific point?

Tips on streamlining two similar TypeScript interfaces with distinct key names

How can I transfer the document id from Angular Firestore to a different component?

Angular 4: Utilizing a class with a constructor to create an http Observable model

Learn the proper way to write onClick in tsx with Vue 2.7.13

Troubleshooting issue with Express.json() functionality in the latest release of version 4.17

ERROR : The value was modified after it had already been checked for changes

Typescript error: Cannot assign type to argument

What causes interface to generate TS2345 error, while type does not?

Typescript: When using ts-node-dev, an error occurred while trying to import express due to an unexpected