Convert JSON String to JSON Object Javascript

Websolutionstuff | Jul-14-2021 | Categories : jQuery

In this example we will see convert JSON string to JSON object in Javascript. You can use the javascript JSON.parse() method to convert a JSON string into a JSON object. JSON is used for exchange data between server and web.

JSON (JavaScript Object Notation) is a lightweight data-interchange format. It is easy for humans to read and write. It is easy for machines to parse and generate.

JSON has built on two types :

  • A collection of key and value pairs.
  • An ordered list of values.

So, let's start example of convert JSON string to JSON object in Javascript

Example - 1

we recived JSON string from web server.

'{"name":"dell", "age":20, "city":"Dubai", "gender":"male"}'

Now we can convert string to json object using json.parse() method.

var user = JSON.parse('{"name":"dell", "age":20, "city":"Dubai", "gender":"male"}');

 

Example - 2

 Now we are converting JSON text to Javascript Object like below example.

<script>
const txt = '{"name":"dell", "age":20, "city":"Dubai", "gender":"male"}'
const obj = JSON.parse(txt);
console.log("Name: "+obj.name);
console.log("Age: "+obj.age);
</script>

 

Example - 3

Now in this example convert Array as JSON using json.parse() method in javascript. so, parsing json array will be parsed into a JavaScript array.

<script>
const text = '[ "Dell", "30", "Dubai", "Male" ]';
const parseArr = JSON.parse(text);
console.log(parseArr[0]);
console.log(parseArr[1]);
</script>

 

Recommended Post
Featured Post
Laravel 9 Two Factor Authentication With SMS
Laravel 9 Two Factor Authentic...

In this article, we will see laravel 9 two-factor authentication with SMS. we will send an OTP SMS to the mobile nu...

Read More

Sep-26-2022

How To Get The ID Of An Element Using jQuery
How To Get The ID Of An Elemen...

In this article, we will see how to get the id of an element using jquery. Using the jquery attr() method to get or...

Read More

Jul-04-2022

How To Create Calendar Event In Laravel 9 Using AJAX
How To Create Calendar Event I...

In this article, we will see how to create a calendar event in laravel 9 using ajax. Here, we will learn how to add...

Read More

Dec-28-2022

Send Email In Laravel
Send Email In Laravel

In this article, we will explore the process of sending emails in Laravel, covering versions 6, 7, 8, 9, and 10. Email f...

Read More

Sep-02-2020