Updated April 1, 2023
Introduction to TypeScript JSON
The JSON objects are used to transport and store data between the client and server and for the JSON objects to be able to access the methods of the TypeScript class, we make use of a method called assign method of object class and this assign method creates a copy of the JSON object to the TypeScript class and another way for the JSON objects to be able to access the methods of the class is to make use of class transformer tool in out TypeScript program from which the necessary method is imported for the JSON object to access the class.
Syntax for JSON objects to access the TypeScript class:
Object.assign(new TypeScript_class(), JSONobject);
plainToClass(TypeScript_class(), JSONobject);
- new Typescript class creates the instance of the class.
- JSONobject represents the object in JSON trying to access the method in class.
- plainToClass is the method imported by class transformer tool to enable the JSON object to access methods in class.
Working of JSON in TypeScript
- The data can be stored and transported between the client and server using JSON objects.
- The JSON objects can access the methods in two ways, one is by using the assign method and the other is by using the class transformer tool.
- The assign method helps the JSON objects to access the methods by creating a copy of the JSON object.
- The class transformer tool imports the necessary method required to enable the JSON objects to access the methods.
Examples
Given below are the examples mentioned:
Example #1
TypeScript program to create a class and a JSON object and then enable the JSON object to access the TypeScript class by making use of the assign method and then display the output on the screen.
Code:
//a TypeScript class defined to compute the power of a number whose value is provided in the JSON object file
class compute
{
numb:number;
power()
{
//defining two variables whose scope is within the block and then obtaining the value of the number using which the power can be calculated from the JSON object file
let num = 2;
let num1 = Math.pow(num,this.numb);
this.numb = num1;
return this.numb;
}
}
//contents stored in the JSON object file saved as jsonobject.json
{
"numb": 2
}
//Actual program to enable the json object to access the method in the TypeScript class
//the JSON object file is imported
import jsonobject from 'C:/Users/admin/Desktop/jsonobject.json';
class compute
{
numb:number;
power()
{
let num = 2;
let num1 = Math.pow(num,this.numb);
this.numb = num1;
return this.numb;
}
}
//an instance of the TypeScript class is created and passed as a parameter to the assign function along with the data present in the JSON object file
let instcompute = Object.assign(new compute(), jsonData);
console.log(instcompute);
Output:
In the above program, we are defining a class in which consists of a function called compute to compute the power of a number whose value is provided by the JSON object file stored in a specific location. Then the JSON object file is imported to enable the JSON object to access the methods of the class. Then an instance of the class is created which is passed as a parameter to the assign function along with the data present in the JSON object file.
Example #2
TypeScript program to create a class and a JSON object and then enable the JSON object to access the TypeScript class by making use of class transformer tool and then display the output on the screen.
Code:
//a TypeScript class defined to compute the power of a number whose value is provided in the JSON object file
class compute
{
numb:number;
power()
{
//defining two variables whose scope is within the block and then obtaining the value of the number using which the power can be calculated from the JSON object file
let num = 2;
let num1 = Math.pow(num,this.numb);
this.numb = num1;
return this.numb;
}
}
//contents stored in the JSON object file saved as jsonobject.json
{
"numb": 3
}
//Actual program to enable the json object to access the method in the TypeScript class
//the JSON object file is imported
import jsonobject from 'C:/Users/admin/Desktop/jsonobject.json';
//importing the necessary method to enable the JSON object to access the methods in the TypeScript class from class transformer tool
import { plainToClass } from “class-transformer”;
class compute
{
numb:number;
power()
{
let num = 2;
let num1 = Math.pow(num,this.numb);
this.numb = num1;
return this.numb;
}
}
//the plainToClass method from the class transformer tool will enable the Json Object to access the methods in the TypeScript class
let instcompute = plainToClass(compute(), jsonData);
console.log(instcompute);
Output:
In the above program, we are defining a class which consists of a function called compute to compute the power of a number whose value is provided by the JSON object file stored in a specific location. Then the JSON object file stored in a specific location and the necessary method required to enable the JSON object to access the method in the class are imported to enable the JSON object to access the methods of the class. Here the imported method is plainToClass method. Then the class and the data present in the JSON object file is passed as a parameter to plainToClass method to compute the power of a given number.
Conclusion
In this article, we saw the concept of accessing class by JSON object using assign method and class transformer tool which imports the necessary method to enable the JSON object to access the methods in class and corresponding programming examples with their outputs to demonstrate them.
Recommended Articles
We hope that this EDUCBA information on “TypeScript JSON” was beneficial to you. You can view EDUCBA’s recommended articles for more information.