Teleporting a Human : Understanding Serialization & Deserialization in JavaScript

Teleporting a Human : Understanding Serialization & Deserialization in JavaScript

Easiest way to Copy Object in JavaScript

While learning object in JavaScript you may also stuck in the problem of how to copy an object without and reference. And, while finding the solution for this problem you may came across the process of serialization and Deserialization. Well, this is the one of the most popular ways to copy an object in javascript (no matter whether the object may be nested ). This also helps to store object and transfer over network.

We can compare this with the concept of teleporting a human which our scientist trying to achieve in reality. Acc. to concept, we first convert the human to some sort of energy then transmit the energy over the network to target and again, converting the energy into human upon reaching the target. The process of serialization and deserialization also works in the same way. So, let’s understand the Serialization and deserialization in detail.


What is Serialization ? - Converting human to energy

The serialization is the process of converting the an object or array of javascript into a format that can easily be stored or transmitted. It also allow complex data to be converted into shareable format. It is way to make copy of an object in javascript. Let’s understand this by an example :-

While doing human teleport in many movies we saw that, the human body if first converted into some sort of energy and them, send that energy to the target. The serialization also works in same way where we convert object into JSON ( JavaScript Object Notation ) format to make it sharable.

The process of serialization is done by using the JSON.stringify() method.

const person = {
    name: "Piysuh",
    age: 26,
    hasgf: false, 
    fullName: {
        fname: "Piysuh",
        lname: "garg"
    }
};

const Updated_string = JSON.stringify(person)
console.log(Updated_string)
// Output :- {"name":"Piysuh","age":26,"hasgf":false,"fullName":{"fname":"Piysuh","lname":"garg"}}

What is Deserialization ? - Converting energy back to Human

The Deserialization is opposite to the serialization. It is the process of converting string data back to reusable object. In javascript, this means converting the JSON string back to object. Let’s understand it by an example :

So, in serialization we converted the human into energy and send it to the target. Now, when the energy is reached the target we are converting it back into the human. The deserialization also works in same way where we are converting the JSON string back to object.

To convert the JSON string back to javascript object we use the JSON.parse() method.

const person = {
    name: "Piysuh",
    age: 26,
    hasgf: false, 
    fullName: {
        fname: "Piysuh",
        lname: "garg"
    }
};

const Updated_string = JSON.stringify(person)
const Copied_person = JSON.parse(Updated_string); /// Created the copy of person object
console.log(Copied_person)
// Output :- { name: 'Piysuh', age: 26, hasgf: false, fullName: { fname: 'Piysuh', lname: 'garg' }}

Necessity of Serialization and de -serialization

So, we learnt about the serialization and deserialization. Now, there is a question in your mind that is “What is the use of the process of serialization and deserialization in javascript. So, let’s explore the use of it.

A real-life use case of serialization and deserialization is when a web application saves a user's progress on a game or form, where the current state of the game or form data (like user input) is converted into a format that can be stored on the server (serialized), and then later retrieved and reconstructed when the user returns to the application (deserialized), allowing them to pick up where they left off.

So, from the the above use case we understand the Necessity of Serialization and de -serialization.


Conclusion

In conclusion, serialization and deserialization are the important aspects of the web development that allow the conversion of complex data into simpler format and helps to send data over a network. So, this is all about the process of serialization and deserialization in javascript. I hope this article helps you to understand the concept. If yes ! them, please like my article and suggest me any change in comment section if needed. That’s it for Toady , see you soon !