How to Convert XML to JSON in JavaScript?

The advent of technology has accelerated everything. That is why everything is just a click away. The same is the case with file conversions. But some people do not like the one-click converters, as they don’t find such tools safe. If you are one of them, this guide is for you.

Here, instead of discussing the automated way, we will discuss a simple procedure following JavaScript instructions to convert XML to JSON files. So, if you are up for a similar discussion, this is where you might want to stick around.

A Brief Overview of XML and JSON:

Many programming languages prefer XML and JSON formats to interchange data between different applications. But what exactly are XML and JSON?

XML

XML is an acronym for eXtensible Markup Language. The term ‘eXtensible’ means the ability to define and create your own tags. So, unlike HTML, XML doesn’t have self-defined tags. Instead, this markup language will enable you to create your own tags according to your program or data requirement.

Developers often take assistance from XML language to store and transfer data. So, unlike HTML, which works with CSS to display the data beautifully, you can’t use XML to display data. Instead, this markup language carries that data from one application to others.

JSON

JSON stands for JavaScript Object Notation. It is a syntax for storing and exchanging data that works alongside other programming languages, like JavaScript, PHP, etc. The text you write in JSON is according to the syntax of JavaScript objects.

Developers use JSON to create a communication pathway between clients and servers. This scenario is similar to the situation when two people communicate with each other. But unlike text, you will need JSON format to communicate between clients and servers.

How to Convert XML to JSON Manually?

There are several ways of accurately converting XML to JSON in JavaScript. However, in this guide, we will take assistance from the best way to convert XML to JSON.

This method will take assistance from the ‘npm package’ to convert XML data to JSON format. We will divide this procedure into different phases. This way, even technophobes can follow this guide easily.

Steps to Install the ‘npm package’

Before moving toward the conversion process, we’ll first install the npm package. So, try the following steps.

1. Whichever editor you use, type the following command in its ‘TERMINAL’ and hit the ‘Enter’ key to execute it.

npm install fs xmljs

2. Your system will take some time to install the ‘npm package.’ But once your system has successfully added this package, you will see the following message.
3. After this, you can type ‘cls’ in the ‘TERMINAL’ to clear the screen. However, this step is not necessary.

Steps for How to Convert XML String to JSON in JavaScript

As this guide targets the conversion process of XML strings to JSON, we’ll write the result of the XML file into a JSON file. For this example, we have selected two random students’ information as our XML file data. So, our XML file will contain the following data for each student:

• First name.
• Last name.

Now, let’s move to the code.

First, we’ll write the code for inputting the data into the XML file. So, you can copy-paste the same in your JavaScript editor.

var fs = require(‘fs’)

var convertXMLtoJson = require(‘xml2js’)

var xmldata = ‘?xml version=”1.0″ encoding=”UTF-8″?’ +

‘Student’ +

‘PersonalInformation’ +

‘FirstNameA/FirstName’ +

‘LastNameB/LastName’ +

‘GenderMale/Gender’ +

‘/PersonalInformation’ +

‘PersonalInformation’ +

‘FirstNameC/FirstName’ +

‘LastNameD/LastName’ +

‘GenderMale/Gender’ +

‘/PersonalInformation’ +

‘/Student’;

Once everything is in place for the XML file, we’ll write the code for converting the XML string to JSON.

convertXMLtoJson.parseString(xmldata,function(err,results){

fs.writeFile(“xmlToJson.json”,JSON.stringify(results),function(err){

console.log(‘JSON file is generated’)

})

})

Now, run the program and the ‘TERMINAL’ will show you the following message

JSON file is generated

So, upon clicking on the generated JSON file, you can see the transfer of the XML string to the JSON file.

Sometimes, this method destroys the format of the string upon converting XML data to a JSON file. So, if this situation represents your case, you can take assistance from a JSON formatter.

Conclusion:

XML came in 1996. So, it is as old as HTML, which came in 1991. However, people still take assistance from this eXtensible Markup Language to transfer data.

On the other hand, JSON provides a faster way of interchanging the data because the encoding process involved in JSON is short. That’s because the parsers of JSON are less complex. So, JSON requires fewer bytes, less processing time and memory overhead to transfer data.

Thus, considering the benefits of JSON over XML, if you want to convert a string written in XML to JSON, you can take assistance from this guide. But apart from the above-discussed procedure, nowadays, developers have developed one-click XML to JSON and vice versa converters. So, if the above-discussed steps sound gibberish to you, we recommend trying out one of those converters.