EDUCBA Logo

EDUCBA

MENUMENU
  • Explore
    • EDUCBA Pro
    • PRO Bundles
    • Featured Skills
    • New & Trending
    • Fresh Entries
    • Finance
    • Data Science
    • Programming and Dev
    • Excel
    • Marketing
    • HR
    • PDP
    • VFX and Design
    • Project Management
    • Exam Prep
    • All Courses
  • Blog
  • Enterprise
  • Free Courses
  • Log in
  • Sign Up
Home Software Development Software Development Tutorials TypeScript Tutorial TypeScript JSON
 

TypeScript JSON

Updated April 1, 2023

TypeScript JSON

 

 

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.

Watch our Demo Courses and Videos

Valuation, Hadoop, Excel, Mobile Apps, Web Development & many more.

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:

TypeScript JSON 1

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:

TypeScript JSON 2

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.

  1. TypeScript Dictionary
  2. TypeScript Generic
  3. TypeScript Array
  4. TypeScript Operators

Primary Sidebar

Footer

Follow us!
  • EDUCBA FacebookEDUCBA TwitterEDUCBA LinkedINEDUCBA Instagram
  • EDUCBA YoutubeEDUCBA CourseraEDUCBA Udemy
APPS
EDUCBA Android AppEDUCBA iOS App
Blog
  • Blog
  • Free Tutorials
  • About us
  • Contact us
  • Log in
Courses
  • Enterprise Solutions
  • Free Courses
  • Explore Programs
  • All Courses
  • All in One Bundles
  • Sign up
Email
  • [email protected]

ISO 10004:2018 & ISO 9001:2015 Certified

© 2025 - EDUCBA. ALL RIGHTS RESERVED. THE CERTIFICATION NAMES ARE THE TRADEMARKS OF THEIR RESPECTIVE OWNERS.

EDUCBA

*Please provide your correct email id. Login details for this Free course will be emailed to you
Loading . . .
Quiz
Question:

Answer:

Quiz Result
Total QuestionsCorrect AnswersWrong AnswersPercentage

Explore 1000+ varieties of Mock tests View more

EDUCBA

*Please provide your correct email id. Login details for this Free course will be emailed to you
EDUCBA
Free Software Development Course

Web development, programming languages, Software testing & others

By continuing above step, you agree to our Terms of Use and Privacy Policy.
*Please provide your correct email id. Login details for this Free course will be emailed to you
EDUCBA

*Please provide your correct email id. Login details for this Free course will be emailed to you

EDUCBA Login

Forgot Password?

🚀 Limited Time Offer! - 🎁 ENROLL NOW