json assignment format

JSON for Beginners – JavaScript Object Notation Explained in Plain English

Many software applications need to exchange data between a client and server.

For a long time, XML was the preferred data format when it came to information exchange between the two points. Then in early 2000, JSON was introduced as an alternate data format for information exchange.

In this article, you will learn all about JSON. You'll understand what it is, how to use it, and we'll clarify a few misconceptions. So, without any further delay, let's get to know JSON.

What is JSON?

JSON ( J ava S cript O bject N otation) is a text-based data exchange format. It is a collection of key-value pairs where the key must be a string type, and the value can be of any of the following types:

A couple of important rules to note:

In the JSON data format, the keys must be enclosed in double quotes.
The key and value must be separated by a colon (:) symbol.
There can be multiple key-value pairs. Two key-value pairs must be separated by a comma (,) symbol.
No comments (// or /* */) are allowed in JSON data. (But you can get around that , if you're curious.)

Here is how some simple JSON data looks:

Valid JSON data can be in two different formats:

A collection of key-value pairs enclosed by a pair of curly braces {...} . You saw this as an example above.
A collection of an ordered list of key-value pairs separated by comma (,) and enclosed by a pair of square brackets [...] . See the example below:

Suppose you are coming from a JavaScript developer background. In that case, you may feel like the JSON format and JavaScript objects (and array of objects) are very similar. But they are not. We will see the differences in detail soon.

The structure of the JSON format was derived from the JavaScript object syntax. That's the only relationship between the JSON data format and JavaScript objects.

JSON is a programming language-independent format. We can use the JSON data format in Python, Java, PHP, and many other programming languages.

JSON Data Format Examples

You can save JSON data in a file with the extension of .json . Let's create an employee.json file with attributes (represented by keys and values) of an employee.

The above JSON data shows the attributes of an employee. The attributes are:

name : the name of the employee. The value is of String type. So, it is enclosed with double quotes.
id : a unique identifier of an employee. It is a String type again.
role : the roles an employee plays in the organization. There could be multiple roles played by an employee. So Array is the preferred data type.
age : the current age of the employee. It is a Number .
doj : the date the employee joined the company. As it is a date, it must be enclosed within double-quotes and treated like a String .
married : is the employee married? If so, true or false. So the value is of Boolean type.
address : the address of the employee. An address can have multiple parts like street, city, country, zip, and many more. So, we can treat the address value as an Object representation (with key-value pairs).
referred-by : the id of an employee who referred this employee in the organization. If this employee joined using a referral, this attribute would have value. Otherwise, it will have null as a value.

Now let's create a collection of employees as JSON data. To do that, we need to keep multiple employee records inside the square brackets [...].

Did you notice the referred-by attribute value for the second employee, Bob Washington? It is null . It means he was not referred by any of the employees.

How to Use JSON Data as a String Value

We have seen how to format JSON data inside a JSON file. Alternatively, we can use JSON data as a string value and assign it to a variable. As JSON is a text-based format, it is possible to handle as a string in most programming languages.

Let's take an example to understand how we can do it in JavaScript. You can enclose the entire JSON data as a string within a single quote '...' .

If you want to keep the JSON formatting intact, you can create the JSON data with the help of template literals.

It is also useful when you want to build JSON data using dynamic values.

JavaScript Objects and JSON are NOT the Same

The JSON data format is derived from the JavaScript object structure. But the similarity ends there.

Objects in JavaScript:

Can have methods, and JSON can't.
The keys can be without quotes.
Comments are allowed.
Are JavaScript's own entity.

Here's a Twitter thread that explains the differences with a few examples.

JavaScript Object and JSON(JavaScript Object Notation) are NOT the same. We often think they are similar. That's NOT TRUE 👀 Let's Understand 🔥 A Thread 🧵 👇 — Tapas Adhikary (@tapasadhikary) November 24, 2021

How to Convert JSON to a JavaScript Object, and vice-versa

JavaScript has two built-in methods to convert JSON data into a JavaScript object and vice-versa.

How to Convert JSON Data to a JavaScript Object

To convert JSON data into a JavaScript object, use the JSON.parse() method. It parses a valid JSON string into a JavaScript object.

How to Convert a JavaScript Object to JSON Data

To convert a JavaScript object into JSON data, use the JSON.stringify() method.

Did you notice the JSON term we used to invoke the parse() and stringify() methods above? That's a built-in JavaScript object named JSON (could have been named JSONUtil as well) but it's not related to the JSON data format we've discussed so far. So, please don't get confused.

How to Handle JSON Errors like "Unexpected token u in JSON at position 1"?

While handling JSON, it is very normal to get an error like this while parsing the JSON data into a JavaScript object:

Whenever you encounter this error, please question the validity of your JSON data format. You probably made a trivial error and that is causing it. You can validate the format of your JSON data using a JSON Linter .

Before We End...

I hope you found the article insightful and informative. My DMs are open on Twitter if you want to discuss further.

Recently I have published a few helpful tips for beginners to web development. You may want to have a look:

Let's connect. I share my learnings on JavaScript, Web Development, and Blogging on these platforms as well:

Follow me on Twitter
Subscribe to my YouTube Channel
Side projects on GitHub

Writer . YouTuber . Creator . Mentor

If you read this far, thank the author to show them you care. Say Thanks

Learn to code for free. freeCodeCamp's open source curriculum has helped more than 40,000 people get jobs as developers. Get started

A Beginner's Guide to JSON with Examples

Syntax and data types, json strings, json numbers, json booleans, json objects, json arrays, nesting objects & arrays, transforming json data in javascript, json vs xml, json resources, further reading.

JSON — short for JavaScript Object Notation — is a popular format for storing and exchanging data. As the name suggests, JSON is derived from JavaScript but later embraced by other programming languages.

JSON file ends with a .json extension but not compulsory to store the JSON data in a file. You can define a JSON object or an array in JavaScript or HTML files.

In a nutshell, JSON is lightweight, human-readable, and needs less formatting, which makes it a good alternative to XML.

JSON data is stored as key-value pairs similar to JavaScript object properties, separated by commas, curly braces, and square brackets. A key-value pair consists of a key , called name (in double quotes), followed by a colon ( : ), followed by value (in double-quotes):

Multiple key-value pairs are separated by a comma:

JSON keys are strings , always on the left of the colon, and must be wrapped in double quotes . Within each object, keys need to be unique and can contain whitespaces , as in "author name": "John Doe" .

It is not recommended to use whitespaces in keys. It will make it difficult to access the key during programming. Instead, use an underscore in keys as in "author_name": "John Doe" .

JSON values must be one of the following data types:

Boolean ( true or false )

Note: Unlike JavaScript, JSON values cannot be a function, a date or undefined .

String values in JSON are a set of characters wrapped in double-quotes:

A number value in JSON must be an integer or a floating-point:

Boolean values are simple true or false in JSON:

Null values in JSON are empty words:

JSON objects are wrapped in curly braces. Inside the object, we can list any number of key-value pairs, separated by commas:

JSON arrays are wrapped in square brackets. Inside an array, we can declare any number of objects, separated by commas:

In the above JSON array, there are three objects. Each object is a record of a person (with name, gender, and age).

JSON can store nested objects and arrays as values assigned to keys. It is very helpful for storing different sets of data in one file:

The JSON format is syntactically similar to the way we create JavaScript objects. Therefore, it is easier to convert JSON data into JavaScript native objects.

JavaScript built-in JSON object provides two important methods for encoding and decoding JSON data: parse() and stringify() .

JSON.parse() takes a JSON string as input and converts it into JavaScript object:

JSON.stringify() does the opposite. It takes a JavaScript object as input and transforms it into a string that represents it in JSON:

A few years back, XML (Extensible Markup Language) was a popular choice for storing and sharing data over the network. But that is not the case anymore.

JSON has emerged as a popular alternative to XML for the following reasons:

Less verbose — XML uses many more words than required, which makes it time-consuming to read and write.
Lightweight & faster — XML must be parsed by an XML parser, but JSON can be parsed using JavaScript built-in functions. Parsing large XML files is slow and requires a lot of memory.
More data types — You cannot store arrays in XML which are extensively used in JSON format.

Let us see an example of an XML document and then the corresponding document written in JSON:

databases.xml

databases.json

As you can see above, the XML structure is not intuitive , making it hard to represent in code. On the other hand, the JSON structure is much more compact and intuitive , making it easy to read and map directly to domain objects in any programming language.

There are many useful resources available online for free to learn and work with JSON:

Introducing JSON — Learn the JSON language supported features.
JSONLint — A JSON validator that you can use to verify if the JSON string is valid.
JSON.dev — A little tool for viewing, parsing, validating, minifying, and formatting JSON.
JSON Schema — Annotate and validate JSON documents according to your own specific format.

A few more articles related to JSON that you might be interested in:

How to read and write JSON files in Node.js
Reading and Writing JSON Files in Java
How to read and write JSON using Jackson in Java
How to read and write JSON using JSON.simple in Java
Understanding JSON.parse() and JSON.stringify()
Processing JSON Data in Spring Boot
Export PostgreSQL Table Data as JSON

✌️ Like this article? Follow me on Twitter and LinkedIn . You can also subscribe to RSS Feed .

Buy me a coffee ☕

If you enjoy reading my articles and want to help me out paying bills, please consider buying me a coffee ($5) or two ($10). I will be highly grateful to you ✌️

Enter the number of coffees below:

✨ Learn to build modern web applications using JavaScript and Spring Boot

I started this blog as a place to share everything I have learned in the last decade. I write about modern JavaScript, Node.js, Spring Boot, core Java, RESTful APIs, and all things web development.

The newsletter is sent every week and includes early access to clear, concise, and easy-to-follow tutorials, and other stuff I think you'd enjoy! No spam ever, unsubscribe at any time.

JavaScript, Node.js & Spring Boot
In-depth tutorials
Super-handy protips
Cool stuff around the web
1-click unsubscribe
No spam, free-forever!

Ace your Coding Interview

DSA Problems
Binary Tree
Binary Search Tree
Dynamic Programming
Divide and Conquer
Linked List
Backtracking

JSON Tutorial – Introduction, Structure, Syntax Rules, and Data Exchange

In this tutorial, we’ll introduce the JSON data exchange format . This post covers a JSON object’s structure, JSON syntax rules, data exchange with JSON, and programming languages support for JSON.

What is JSON?

JSON is a lightweight, human-readable data-interchange format.
JSON is used to store a collection of name-value pairs or an ordered list of values.
JSON is useful for serializing objects , and arrays for transmitting over the network.
JSON is very easy to parse and generate and doesn’t use a full markup structure like an XML.
JSON became a popular alternative of XML format for its fast asynchronous client–server communication.
All JSON files have the extension .json .

Structure of a JSON Object:

A JSON can be:

JSON Example:

In the above example,

The first two name-value pairs maps a string to another string.
The third name-value pair maps a string age with a number 25.
The fourth name-value pair maps a string children with an empty array [] .
The fifth name-value pair maps a string spouse with a null value.
The sixth name-value pair maps a string address with another JSON object.
The seventh name-value pair maps a string phoneNumbers with an array of JSON objects.

JSON Syntax Rules:

A JSON object is surrounded by curly braces {} .
The name-value pairs are grouped by a colon (:) and separated by a comma (,) .
An array begins with a left bracket and ends with a right bracket [] .
The trailing commas and leading zeros in a number are prohibited.
The octal and hexadecimal formats are not permitted.
Each key within the JSON should be unique and should be enclosed within the double-quotes.
The boolean type matches only two special values: true and false and NULL values are represented by the null literal (without quotes).

JavaScript JSON built-in library:

JavaScript JSON built-in library provides two functions to decode and encode JSON objects – JSON.parse() and JSON.stringify() .

1. JSON.stringify() returns a JSON string corresponding to a JavaScript object.

Output: {“fruit”:”Apple”, “types”:[“Small”,”Medium”,”Large”], “quantity”:1000}

2. JSON.parse() is a safe and fast method of decoding a JSON string as JavaScript object.

Output: Apple, [Small,Medium,Large], 1000

We can also parse a JSON string into a JavaScript object by invoking the eval() function on the JSON string wrapped by parenthesis. This works since JSON is derived from JavaScript. eval() is an evil function, which should be avoided at all costs. This is because eval can execute any malicious scripts on the user’s machine with the caller’s privileges. Moreover, malicious code can find the scope in which eval() was invoked, making the website vulnerable to attacks. JSON.parse() is the safe and fast alternative of eval, which safely fails on malicious code. JSON is included in almost all modern browsers. For old versions of browsers, use an external JavaScript library such as Douglas Crockford’s json2.js .

Data Exchange with JSON:

JSON is primarily used for the transmission of serialized text between a browser and a server.

The official Media type for JSON is application/json .

Programming Languages Support:

Originally, JSON was intended to be a subset of the JavaScript languages, but now almost all major programming languages support JSON due to its language-independent data format. JSON’s official website lists major JSON libraries available in various programming languages which can be used to parse and generate JSON. For instance, the most popular JSON libraries for Java are GSON, JSON.simple, Jackson, and JSONP.

That’s all about JSON data exchange format.

Useful links:

JSON Validator
JSON Formatter
JSON Minifier
JSON Editor
JSON to XML
JSON to YAML
JSON to CSV

XML Tutorial – Introduction, Structure, and Syntax Rules

Rate this post

Average rating 4.72 /5. Vote count: 29

No votes so far! Be the first to rate this post.

We are sorry that this post was not useful for you!

Tell us how we can improve this post?

Thanks for reading.

To share your code in the comments, please use our online compiler that supports C, C++, Java, Python, JavaScript, C#, PHP, and many more popular programming languages.

Like us? Refer us to your friends and support our growth. Happy coding :)

Software Engineer | Content Writer | 12+ years experience

A beginner's guide to JSON, the data format for the internet

When APIs send data, chances are they send it as JSON objects. Here's a primer on why JSON is how networked applications send data.

As the web grows in popularity and power, so does the amount of data stored and transferred between systems, many of which know nothing about each other. From early on, the format that this data was transferred in mattered, and like the web, the best formats were open standards that anyone could use and contribute to. XML gained early popularity, as it looked like HTML, the foundation of the web. But it was clunky and confusing.

That’s where JSON (JavaScript Object Notation) comes in. If you’ve consumed an API in the last five to ten years, you’ve probably seen JSON data. While the format was first developed in the early 2000s, the first standards were published in 2006. Understanding what JSON is and how it works is a foundational skill for any web developer.

In this article, we’ll cover the basics of what JSON looks like and how to use it in your web applications, as well as talk about serialized JSON—JST and JWT—and the competing data formats.

What JSON looks like

JSON is a human-readable format for storing and transmitting data. As the name implies, it was originally developed for JavaScript, but can be used in any language and is very popular in web applications. The basic structure is built from one or more keys and values:

You’ll often see a collection of key:value pairs enclosed in brackets described as a JSON object. While the key is any string, the value can be a string, number, array, additional object, or the literals, false, true and null. For example, the following is valid JSON:

JSON doesn't have to have only key:value pairs; the specification allows to any value to be passed without a key. However, almost all of the JSON objects that you see will contain key:value pairs.

Using JSON in API calls

One of the most common uses for JSON is when using an API, both in requests and responses. It is much more compact than other standards and allows for easy consumption in web browsers as JavaScript can easily parse JSON strings, only requiring JSON.parse() to start using it.

JSON.parse(string) takes a string of valid JSON and returns a JavaScript object. For example, it can be called on the body of an API response to give you a usable object. The inverse of this function is JSON.stringify(object) which takes a JavaScript object and returns a string of JSON, which can then be transmitted in an API request or response.

JSON isn’t required by REST or GraphQL, both very popular API formats. However, they are often used together, particularly with GraphQL, where it is best practice to use JSON due to it being small and mostly text. If necessary, it compresses very well with GZIP.

GraphQL's requests aren’t made in JSON, instead using a system that resembles JSON, like this

Which will return the relevant data, and if using JSON, it will match very closely:

Using JSON files in JavaScript

In some cases, you may want to load JSON from a file, such as for configuration files or mock data. Using pure JavaScript, it currently isn’t possible to import a JSON file, however a proposal has been created to allow this . In addition, it is a very common feature in bundlers and compilers, like webpack and Babel . Currently, you can get equivalent functionality by exporting a JavaScript Object the same as your desired JSON from a JavaScript file.

export const data = {"foo": "bar"}

Now this object will be stored in the constant, data, and will be accessible throughout your application using import or require statements. Note that this will import a copy of the data, so modifying the object won’t write the data back to the file or allow the modified data to be used in other files.

Accessing and modifying JavaScript objects

Once you have a variable containing your data, in this example data, to access a key’s value inside it, you could use either data.key or data["key"]. Square brackets must be used for array indexing; for example if that value was an array, you could do data.key[0], but data.key.0 wouldn’t work.

Object modification works in the same way. You can just set data.key = "foo" and that key will now have the value “foo”. Although only the final element in the chain of objects can be replaced; for example if you tried to set data.key.foo.bar to something, it would fail as you would first have to set data.key.foo to an object.

Comparison to YAML and XML

JSON isn’t the only web-friendly data standard out there. The major competitor for JSON in APIs is XML. Instead of the following JSON:

in XML, you’d instead have:

JSON was standardized much later than XML, with the specification for XML coming in 1998, whereas Ecma International standardized JSON in 2013. XML was extremely popular and seen in standards such as AJAX (Asynchronous JavaScript and XML) and the XMLHttpRequest function in JavaScript.

XML used by a major API standard: Simple Object Access Protocol (SOAP). This standard can be significantly more verbose than REST and GraphQL, in part due to the usage of XML and because the standard includes more information, such as describing the XML namespace as part of the envelope system. This might be a reason why SOAP usage has declined for years.

Another alternative is YAML, which is much more similar in length to JSON compared to XML, with the same example being:

However, unlike XML, YAML doesn’t really compete with JSON as an API data format. Instead, it’s primarily used for configuration files— Kubernetes primarily uses YAML to configure infrastructure. YAML offers features that JSON doesn’t have, such as comments. Unlike JSON and XML, browsers cannot parse YAML, so a parser would need to be added as a library if you want to use YAML for data interchange.

Signed JSON

While many of JSONs use cases transmit it as clear text, the format can be used for secure data transfers as well. JSON web signatures (JWS) are JSON objects securely signed using either a secret or a public/private key pair. These are composed of a header , payload , and signature .

The header specifies the type of token and the signing algorithm being used. The only required field is alg to specify the encryption algorithm used, but many other keys can be included, such as typ for the type of signature it is.

The payload of a JWS is the information being transmitted and doesn’t need to be formatted in JSON though commonly is.

The signature is constructed by applying the encryption algorithm specified in the header to the base64 versions of the header and payload joined by a dot. The final JWS is then the base64 header, base64 payload, and signature joined by dots. For example:

eyJ0eXAiOiJKV1QiLA0KICJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJqb2UiLA0KICJleHAiOjEzMDA4MTkzODAsDQogImh0dHA6Ly9leGFtcGxlLmNvbS9pc19yb290Ijp0cnVlfQ.dBjftJeZ4CVP-mB92K27uhbUJU1p1r_wW1gFWFOEjXk

JSON Web Tokens (JWT) are a special form of a JWS. These are particularly useful for authorization : when a user logs into a website, they will be provided with a JWT. For each subsequent request, they will include this token as a bearer token in the authorization header.

To create a JWT from a JWS, you’ll need to configure each section specifically. In the header , ensure that the typ key is JWT. For the alg key, the options of HS256 (HMAC SHA-256) and none (unencrypted) must be supported by the authorization server in order to be a conforming JWT implementation, so can always be used. Additional algorithms are recommended but not enforced.

In the payload are a series of keys called claims, which are pieces of information about a subject, as JWTs are most commonly used for authentication, this is commonly a user, but could be anything when used for exchanging information.

The signature is then constructed in the same way as all other JWSs.

Compared to Security Assertion Markup Language Tokens (SAML), a similar standard that uses XML, JSON allows for JWTs to be smaller than SAML tokens and is easier to parse due to the use of both tokens in the browser, where JavaScript is the primary language, and can easily parse JSON.

JSON has come to be one of the most popular standards for data interchange, being easy for humans to read while being lightweight to ensure small transmission size. Its success has also been caused by it being equivalent to JavaScript objects, making it simple to process in web frontends. However, JSON isn’t the solution for everything, and alternate standards like YAML are more popular for things like configuration files, so it’s important to consider your purpose before choosing.

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. It is based on a subset of the JavaScript Programming Language Standard ECMA-262 3rd Edition - December 1999. JSON is a text format that is completely language independent but uses conventions that are familiar to programmers of the C-family of languages, including C, C++, C#, Java, JavaScript, Perl, Python, and many others. These properties make JSON an ideal data-interchange language.

JSON is built on two structures:

A collection of name/value pairs. In various languages, this is realized as an object , record, struct, dictionary, hash table, keyed list, or associative array.
An ordered list of values. In most languages, this is realized as an array , vector, list, or sequence.

These are universal data structures. Virtually all modern programming languages support them in one form or another. It makes sense that a data format that is interchangeable with programming languages also be based on these structures.

In JSON, they take on these forms:

An object is an unordered set of name/value pairs. An object begins with { left brace and ends with } right brace . Each name is followed by : colon and the name/value pairs are separated by , comma .

An array is an ordered collection of values. An array begins with [ left bracket and ends with ] right bracket . Values are separated by , comma .

A value can be a string in double quotes, or a number , or true or false or null , or an object or an array . These structures can be nested.

A string is a sequence of zero or more Unicode characters, wrapped in double quotes, using backslash escapes. A character is represented as a single character string. A string is very much like a C or Java string.

A number is very much like a C or Java number, except that the octal and hexadecimal formats are not used.

Whitespace can be inserted between any pair of tokens. Excepting a few encoding details, that completely describes the language.

json element

value object array string number "true" "false" "null"

object '{' ws '}' '{' members '}'

members member member ',' members

member ws string ws ':' element

array '[' ws ']' '[' elements ']'

elements element element ',' elements

element ws value ws

string '"' characters '"'

characters "" character characters

character '0020' . '10FFFF' - '"' - '\' '\' escape

escape '"' '\' '/' 'b' 'f' 'n' 'r' 't' 'u' hex hex hex hex

hex digit 'A' . 'F' 'a' . 'f'

number integer fraction exponent

integer digit onenine digits '-' digit '-' onenine digits

digits digit digit digits

digit '0' onenine

onenine '1' . '9'

fraction "" '.' digits

exponent "" 'E' sign digits 'e' sign digits

sign "" '+' '-'

ws "" '0020' ws '000A' ws '000D' ws '0009' ws

ActionScript3
GNATCOLL.JSON
JSON for ASP
JSON ASP utility class
JSON_checker
json-parser
M's JSON parser
ThorsSerializer
JSON for Modern C++
ArduinoJson
JSON library for IoT
JSON Support in Qt
JsonWax for Qt
Qentem-Engine
JSON for .NET
Manatee Json
FastJsonParser
Liersch.Json
Liersch.JsonSerialization
JSON Essentials
Redvers COBOL JSON Interface
SerializeJSON
vibe.data.json
json library
Delphi Web Utils
JSON Delphi Library
JSON in TermL
json-fortran
package json
RJson package
json package
json-taglib
json-simple
google-gson
FOSS Nova JSON
Corn CONVERTER
Apache johnzon
Common Lisp JSON
JSON Modules
netdata-json
Module json
NSJSONSerialization
json-framework
JSON Photoshop Scripting
picolisp-json
Public.Parser.JSON
Public.Parser.JSON2
The Python Standard Library
metamagic.json
json-parsing
JSON Utilities
json-stream
JSON-struct
.NET-JSON-Transformer
Videos about JSON
Videos about the JSON Logo
Heresy & Heretical Open Source: A Heretic's Perspective
Nota Message Format

Skip to main content
Select language
Skip to search
Working with JSON data

Other notes

Creating the hero information cards.

JavaScript Object Notation (JSON) is a standard format for representing structured data as JavaScript objects, which is commonly used for representing and transmitting data on web sites (i.e. sending some data from the server to the client, so it can be displayed on a web page). You'll come across it quite often, so in this article we give you all you need to work with JSON using JavaScript, including accessing data items in a JSON object and writing your own JSON.

No, really, what is JSON?

JSON is a data format following JavaScript object syntax, which was popularized by Douglas Crockford . Even though it is based on JavaScript syntax, it can be used independently from JavaScript, and many programming environments feature the ability to read (parse) and generate JSON.

JSON can exist as an object, or a string — the former is used when you want to read data out of the JSON, and the latter is used when you want to send the JSON across the network. This is not a big issue — JavaScript provides a global JSON object that has methods available for converting between the two.

A JSON object can be stored in its own file, which is basically just a text file with an extension of .json , and a MIME type of application/json .

JSON structure

We've implied above that a JSON object is basically a JavaScript object, and this is mostly right. You can include the same basic data types inside JSON as you can in a standard JavaScript object — strings, numbers, arrays, booleans, and other object literals. This allows you to construct a data hierarchy, like so:

If we loaded this object into a JavaScript program, saved in a variable called superHeroes for example, we could then access the data inside it using the same dot/bracket notation we looked at in the JavaScript object basics article. For example:

To access data further down the hierarchy, you simply have to chain the required property names and array indexes together. For example, to access the third superpower of the second hero listed in the members list, you'd do this:

First we have the variable name — superHeroes .
Inside that we want to access the members property, so we use ["members"] .
members contains an array populated by objects. We want to access the second object inside the array, so we use [1] .
Inside this object, we want to access the powers property, so we use ["powers"] .
Inside the powers property is an array containing the selected hero's superpowers. We want the third one, so we use [2] .

Note : We've made the JSON seen above available inside a variable in our JSONTest.html example (see the source code ). Try loading this up and then accessing data inside the variable via your browser's JavaScript console.

Arrays as JSON

Above we said "We've implied above that a JSON object is basically a JavaScript object, and this is mostly right" — the reason we said "mostly right" is that an array can also be a valid JSON object, for example:

The above is perfectly valid JSON. You'd just have to access array items by starting with an array index, for example [0]["powers"][0] .

JSON is purely a data format — it contains only properties, no methods.
JSON requires double quotes to be used to be valid. It is safest to write it with double quotes, not single quotes.
Even a single misplaced comma or colon can cause a JSON file to go wrong, and not work. You should be careful to validate any data you are attempting to use (although computer-generated JSON is less likely to include errors, as long as the generator program is working correctly). You can validate JSON using an application like JSONLint .
JSON can actually take the form of any data type that is valid for inclusion inside a standard JSON object, not just arrays or objects. So for example, a single string or number would be a valid JSON object. Not that this would be particularly useful...
Unlike in JavaScript code in which identifiers may be used as properties, in JSON, only strings may be used as properties.

Active learning: Working through a JSON example

So, let's work through an example to show how we could make use of some JSON data on a website.

Getting started

To begin with, make local copies of our heroes.html and style.css files. The latter contains some simple CSS to style our page, while the former contains some very simple body HTML:

Plus a element is used to embed or reference an executable script." href="../../../../HTML/Element/Script.html"> <script> element to contain the JavaScript code we will be writing in this exercise. At the moment it only contains two lines, which grab references to the element represents a group of introductory or navigational aids. It may contain some heading elements but also other elements like a logo, a search form, and so on." href="../../../Web/HTML/Element/header.html"> <header> and element represents a standalone section of functionality contained within an HTML document, typically with a heading, which doesn't have a more specific semantic element to represent it." href="../../../Web/HTML/Element/section.html"> <section> elements and store them in variables:

We have made our JSON data available on our GitHub, at https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json .

We are going to load it into our page, and use some nifty DOM manipulation to display it, like this:

Loading our JSON

To load our JSON into our page, we are going to use an API called XMLHttpRequest (often called XHR ). This is a very useful JavaScript object that allows us to make network requests to retrieve resources from a server via JavaScript (e.g. images, text, JSON, even HTML snippets), meaning that we can update small sections of content without having to reload the entire page. This has led to more responsive web pages, and sounds exciting, but it is unfortunately beyond the scope of this article to teach it in much more detail.

To start with, we are going to store the URL of the JSON file we want to retrieve in a variable. Add the following at the bottom of your JavaScript code: var requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
To create a request, we need to create a new request object instance from the XMLHttpRequest constructor, using the new keyword. Add the following below your last line: var request = new XMLHttpRequest();

This takes at least two parameters — there are other optional parameters available. We only need the two mandatory ones for this simple example:

The HTTP method to use when making the network request. In this case GET is fine, as we are just retrieving some simple data.
The URL to make the request to — this is the URL of the JSON file that we stored earlier.
Next, add the following two lines — here we are setting the responseType to JSON, so the server will know we want a JSON object returned, and sending the request with the send() method: request.responseType = 'json'; request.send();
The last bit of this section involves waiting for the response to return from the server, then dealing with it. Add the following code below your previous code: request.onload = function() { var superHeroes = request.response; populateHeader(superHeroes); showHeroes(superHeroes); }

Here we are storing the response to our request (available in the response property) in a variable called superHeroes ; this variable will now contain our JSON! We are then passing that JSON to two function calls — the first one will fill the < header> with the correct data, while the second one will create an information card for each hero on the team, and insert it into the <section> .

We have wrapped the code in an event handler that runs when the load event fires on the request object (see onload ) — this is because the load event fires when the response has successfully returned; doing it this way guarantees that request.response will definitely be available when we come to try to do something with it.

Populating the header

Now we've retrieved our JSON data, let's make use of it by writing the two functions we referenced above. First of all, add the following function definition below the previous code:

We have called the parameter jsonObj , so that's what we need to call the JSON object inside it. Here we first create an is the most important and <h6> is the least. A heading element briefly describes the topic of the section it introduces. Heading information may be used by user agents, for example, to construct a table of contents for a document automatically." href="../../../Web/HTML/Element/h1.html"> <h1> element with createElement() , set its textContent to equal the squadName property of the JSON, then append it to the header using appendChild() . We then do a very similar operation with a paragraph: create it, set its text content and append it to the header. The only difference is that its text is set to a concatenated string containing both the homeTown and formed properties of the JSON.

Next, add the following function at the bottom of the code, which creates and displays the superhero cards:

To start with, we store the members property of the JSON in a new variable. This array contains multiple objects that contain the information for each hero.

Next, we use a for loop to loop through each object in the array. For each one, we:

Create several new elements: an <article> , an <h2> , three <p> s, and a <ul> .
Set the <h2> to contain the current hero's name .
Fill the three paragraphs with their secretIdentity , age , and a line saying "Superpowers:" to introduce the information in the list.
Store the powers property in another new variable called superPowers — this contains an array that lists the current hero's superpowers.
Use another for loop to loop through the current hero's superpowers — for each one we create a <li> element, put the superpower inside it, then put the listItem inside the <ul> element ( myList ) using appendChild() .
The very last thing we do is to append the <h2> , <p> s, and <ul> inside the <article> ( myArticle ), then append the <article> inside the <section> . The order in which things are appended is important, as this is the order they will be displayed inside the HTML.

Note : If you are having trouble getting the example to work, try referring to our heroes-finished.html source code (see it running live also.)

Note : If you are having trouble following the dot/bracket notation we are using to access the JSON, it can help to have the superheroes.json file open in another tab or your text editor, and refer to it as you look at our JavaScript. You should also refer back to our JavaScript object basics article for more information on dot and bracket notation.

Converting between objects and text

The above example was simple in terms of accessing the JSON, because we set the XHR to return the response already in JSON format, using:

But sometimes we aren't so lucky — sometimes we'll receive some JSON data formatted as a text string, and we'll want to convert it to an object. And when we want to send JSON data as some kind of message, we'll often need to convert it to a string for it to work correctly. Luckily, these two problems are so common in web development that a built-in JSON object was added to browsers quite a while ago, containing the following two methods:

parse() : Accepts a JSON object in text string form as a parameter, and returns the corresponding object.
stringify() : Accepts a JSON object as a parameter, and returns the equivalent text string form.

You can see the first one in action in our heroes-finished-json-parse.html example (see the source code ) — this does exactly the same thing as the example we built up earlier, except that we set the XHR to return the JSON as text, then used parse() to convert it to an actual JSON object. The key snippet of code is here:

As you might guess, stringify() works the opposite way. Try entering the following lines into your browser's JavaScript console one by one to see it in action:

Here we're creating a JSON object, then checking what it contains, then converting it to a string using stringify() — saving the return value in a new variable — then checking it again.

In this article, we've given you a simple guide to using JSON in your programs, including how to create and parse JSON, and how to access data locked inside it. In the next article, we'll begin looking at object-oriented JavaScript.

JSON object reference page
XMLHttpRequest object reference page
Using XMLHttpRequest
HTTP request methods
Official JSON web site with link to ECMA standard

How-To Geek

What is json and how do you use it.

JSON (JavaScript Object Notation) is a standardized format for representing structured data.

Quick Links

Json basics, a basic json example, json data types, semantics and validation, designating json content, working with json, json limitations, json alternatives.

JSON (JavaScript Object Notation) is a standardized format for representing structured data. Although JSON grew out of the JavaScript programming language, it's now an ubiquitous method of data exchange between systems. Most modern-day APIs accept JSON requests and issue JSON responses so it's useful to have a good working knowledge of the format and its features.

In this article, we'll explain what JSON is, how it expresses different data types, and the ways you can produce and consume it in popular programming languages. We'll also cover some of JSON's limitations and the alternatives that have emerged.

JSON was originally devised by Douglas Crockford as a stateless format for communicating data between browsers and servers. Back in the early 2000s, websites were beginning to asynchronously fetch extra data from their server, after the initial page load. As a text-based format derived from JavaScript, JSON made it simpler to fetch and consume data within these applications. The specification was eventually standardized as ECMA-404 in 2013 .

JSON is always transmitted as a string. These strings can be decoded into a range of basic data types, including numbers, booleans, arrays, and objects. This means object hierarchies and relationships can be preserved during transmission, then reassembled on the receiving end in a way that's appropriate for the programming environment.

This is a JSON representation of a blog post:

"id": 1001,

"title": "What is JSON?",

"author": {

"name": "James Walker"

"tags": ["api", "json", "programming"],

"published": false,

"publishedTimestamp": null

This example demonstrates all the JSON data types. It also illustrates the concision of JSON-formatted data, one of the characteristics that's made it so appealing for use in APIs. In addition, JSON is relatively easy to read as-is, unlike more verbose formats such as XML .

Six types of data can be natively represented in JSON:

Strings - Strings are written between double quotation marks; characters may be escaped using backslashes.
Numbers - Numbers are written as digits without quotation marks. You can include a fractional component to denote a float. Most JSON parsing implementations assume an integer when there's no decimal point present.
Booleans - The literal values true and false are supported.
Null - The null literal value can be used to signify an empty or omitted value.
Arrays - An array is a simple list denoted by square brackets. Each element in the list is separated by a comma. Arrays can contain any number of items and they can use all the supported data types.
Objects - Objects are created by curly brackets. They're a collection of key-value pairs where the keys are strings, wrapped in double quotation marks. Each key has a value that can take any of the available data types. You can nest objects to create cascading hierarchies. A comma must follow each value, signifying the end of that key-value pair.

JSON parsers automatically convert these data types into structures appropriate to their language. You don't need to manually cast

to an integer, for example. Parsing the entire JSON string is sufficient to map values back to their original data format.

JSON has certain rules that need to be respected when you encode your data. Strings that don't adhere to the syntax won't be parseable by consumers.

It's particularly important to pay attention to quotation marks around strings and object keys. You must also ensure a comma's used after each entry in an object or array. JSON doesn't allow a trailing comma after the last entry though - unintentionally including one is a common cause of validation errors. Most text editors will highlight syntax problems for you, helping to uncover mistakes.

Despite these common trip points, JSON is one of the easiest data formats to write by hand. Most people find the syntax quick and convenient once they gain familiarity with it. Overall JSON tends to be less error-prone than XML, where mismatched opening and closing tags, invalid schema declarations, and character encoding problems often cause issues.

extension is normally used when JSON is saved to a file. JSON content has the standardized MIME type

is sometimes used for compatibility reasons. Nowadays you should rely on

HTTP headers.

Most APIs that use JSON will encapsulate everything in a top-level object:

"error": 1000

This isn't required though - a literal type is valid as the top-level node in a file, so the following examples are all valid JSON too:

They'll decode to their respective scalars in your programming language.

Most programming languages have built-in JSON support. Here's how to interact with JSON data in a few popular environments.

In JavaScript the

methods are used to encode and decode JSON strings:

const post = {

title: "What Is JSON?",

name: "James Walker"

const encodedJson = JSON.stringify(post);

// {"id": 1001, "title": "What Is JSON?", ...}

console.log(encodedJson);

const decodedJson = JSON.parse(encodedJson);

// James Walker

console.log(decodedJson.author.name);

The equivalent functions in PHP are

"id" => 1001,

"title" => "What Is JSON?",

"author" => [

"id" => 1,

"name" => "James Walker"

$encodedJson = json_encode($post);

echo $encodedJson;

$decodedJson = json_decode($encodedJson, true);

echo $decodedJson["author"]["name"];

Python provides

to serialize and deserialize respectively:

import json

"title": "What Is JSON?",

encodedJson = json.dumps(post)

# {"id": 1001, "title": "What Is JSON?", ...}

print(encodedJson)

decodedJson = json.loads(encodedJson)

# James Walker

print(decodedJson["author"]["name"])

Ruby offers

require "json"

"author" => {

encodedJson = JSON.generate(post)

puts encodedJson

decodedJson = JSON.parse(encodedJson)

puts decodedJson["author"]["name"]

JSON is a lightweight format that's focused on conveying the values within your data structure. This makes it quick to parse and easy to work with but means there are drawbacks that can cause frustration. Here are some of the biggest problems.

No Comments

JSON data can't include comments. The lack of annotations reduces clarity and forces you to put documentation elsewhere. This can make JSON unsuitable for situations such as config files, where modifications are infrequent and the purposes of fields could be unclear.

JSON doesn't let you define a schema for your data. There's no way to enforce that

is a required integer field, for example. This can lead to unintentionally malformed data structures.

No References

Fields can't reference other values in the data structure. This often causes repetition that increases filesize. Returning to the blog post example from earlier, you could have a list of blog posts as follows:

"id": 1002,

"title": "What is SaaS?",

Both posts have the same author but the information associated with that object has had to be duplicated. In an ideal world, JSON parser implementations would be able to produce the structure shown above from input similar to the following:

"author": "{{ .authors.james }}"

"authors": {

This is not currently possible with standard JSON.

JSON methods, toJSON

Let’s say we have a complex object, and we’d like to convert it into a string, to send it over a network, or just to output it for logging purposes.

Naturally, such a string should include all important properties.

We could implement the conversion like this:

…But in the process of development, new properties are added, old properties are renamed and removed. Updating such toString every time can become a pain. We could try to loop over properties in it, but what if the object is complex and has nested objects in properties? We’d need to implement their conversion as well.

Luckily, there’s no need to write the code to handle all this. The task has been solved already.

JSON.stringify

The JSON (JavaScript Object Notation) is a general format to represent values and objects. It is described as in RFC 4627 standard. Initially it was made for JavaScript, but many other languages have libraries to handle it as well. So it’s easy to use JSON for data exchange when the client uses JavaScript and the server is written on Ruby/PHP/Java/Whatever.

JavaScript provides methods:

JSON.stringify to convert objects into JSON.
JSON.parse to convert JSON back into an object.

For instance, here we JSON.stringify a student:

The method JSON.stringify(student) takes the object and converts it into a string.

The resulting json string is called a JSON-encoded or serialized or stringified or marshalled object. We are ready to send it over the wire or put into a plain data store.

Please note that a JSON-encoded object has several important differences from the object literal:

Strings use double quotes. No single quotes or backticks in JSON. So 'John' becomes "John" .
Object property names are double-quoted also. That’s obligatory. So age:30 becomes "age":30 .

JSON.stringify can be applied to primitives as well.

JSON supports following data types:

Objects { ... }
Arrays [ ... ]
boolean values true/false ,

For instance:

JSON is data-only language-independent specification, so some JavaScript-specific object properties are skipped by JSON.stringify .

Function properties (methods).
Symbolic keys and values.
Properties that store undefined .

Usually that’s fine. If that’s not what we want, then soon we’ll see how to customize the process.

The great thing is that nested objects are supported and converted automatically.

The important limitation: there must be no circular references.

Here, the conversion fails, because of circular reference: room.occupiedBy references meetup , and meetup.place references room :

Excluding and transforming: replacer

The full syntax of JSON.stringify is:

Most of the time, JSON.stringify is used with the first argument only. But if we need to fine-tune the replacement process, like to filter out circular references, we can use the second argument of JSON.stringify .

If we pass an array of properties to it, only these properties will be encoded.

Here we are probably too strict. The property list is applied to the whole object structure. So the objects in participants are empty, because name is not in the list.

Let’s include in the list every property except room.occupiedBy that would cause the circular reference:

Now everything except occupiedBy is serialized. But the list of properties is quite long.

Fortunately, we can use a function instead of an array as the replacer .

The function will be called for every (key, value) pair and should return the “replaced” value, which will be used instead of the original one. Or undefined if the value is to be skipped.

In our case, we can return value “as is” for everything except occupiedBy . To ignore occupiedBy , the code below returns undefined :

Please note that replacer function gets every key/value pair including nested objects and array items. It is applied recursively. The value of this inside replacer is the object that contains the current property.

The first call is special. It is made using a special “wrapper object”: {"": meetup} . In other words, the first (key, value) pair has an empty key, and the value is the target object as a whole. That’s why the first line is ":[object Object]" in the example above.

The idea is to provide as much power for replacer as possible: it has a chance to analyze and replace/skip even the whole object if necessary.

Formatting: space

The third argument of JSON.stringify(value, replacer, space) is the number of spaces to use for pretty formatting.

Previously, all stringified objects had no indents and extra spaces. That’s fine if we want to send an object over a network. The space argument is used exclusively for a nice output.

Here space = 2 tells JavaScript to show nested objects on multiple lines, with indentation of 2 spaces inside an object:

The third argument can also be a string. In this case, the string is used for indentation instead of a number of spaces.

The space parameter is used solely for logging and nice-output purposes.

Custom “toJSON”

Like toString for string conversion, an object may provide method toJSON for to-JSON conversion. JSON.stringify automatically calls it if available.

Here we can see that date (1) became a string. That’s because all dates have a built-in toJSON method which returns such kind of string.

Now let’s add a custom toJSON for our object room (2) :

As we can see, toJSON is used both for the direct call JSON.stringify(room) and when room is nested in another encoded object.

To decode a JSON-string, we need another method named JSON.parse .

The syntax:

Or for nested objects:

The JSON may be as complex as necessary, objects and arrays can include other objects and arrays. But they must obey the same JSON format.

Here are typical mistakes in hand-written JSON (sometimes we have to write it for debugging purposes):

Besides, JSON does not support comments. Adding a comment to JSON makes it invalid.

There’s another format named JSON5 , which allows unquoted keys, comments etc. But this is a standalone library, not in the specification of the language.

The regular JSON is that strict not because its developers are lazy, but to allow easy, reliable and very fast implementations of the parsing algorithm.

Using reviver

Imagine, we got a stringified meetup object from the server.

It looks like this:

…And now we need to deserialize it, to turn back into JavaScript object.

Let’s do it by calling JSON.parse :

Whoops! An error!

The value of meetup.date is a string, not a Date object. How could JSON.parse know that it should transform that string into a Date ?

Let’s pass to JSON.parse the reviving function as the second argument, that returns all values “as is”, but date will become a Date :

By the way, that works for nested objects as well:

JSON is a data format that has its own independent standard and libraries for most programming languages.
JSON supports plain objects, arrays, strings, numbers, booleans, and null .
JavaScript provides methods JSON.stringify to serialize into JSON and JSON.parse to read from JSON.
Both methods support transformer functions for smart reading/writing.
If an object has toJSON , then it is called by JSON.stringify .

Turn the object into JSON and back

Turn the user into JSON and then read it back into another variable.

Exclude backreferences

In simple cases of circular references, we can exclude an offending property from serialization by its name.

But sometimes we can’t just use the name, as it may be used both in circular references and normal properties. So we can check the property by its value.

Write replacer function to stringify everything, but remove properties that reference meetup :

Here we also need to test key=="" to exclude the first call where it is normal that value is meetup .

If you have suggestions what to improve - please submit a GitHub issue or a pull request instead of commenting.
If you can't understand something in the article – please elaborate.
To insert few words of code, use the <code> tag, for several lines – wrap them in <pre> tag, for more than 10 lines – use a sandbox ( plnkr , jsbin , codepen …)

Lesson navigation

© 2007—2024 Ilya Kantor
about the project
terms of usage
privacy policy

Trending Now
Foundational Courses
Data Science
Practice Problem
Machine Learning
System Design
DevOps Tutorial

JSON Tutorial

JSON Introduction
JSON full form
JSON Data Types
JSON Schema
JavaScript JSON
JavaScript JSON stringify() Method
What is JSON text ?
Interesting facts about JSON

JSON stands for JavaScript Object Notation . It is a format for structuring data. This format is used by different web applications to communicate with each other. It is the replacement of the XML data exchange format. It is easier to structure the data compared to XML . It supports data structures like arrays and objects, and JSON documents that are rapidly executed on the server.

Within this JSON tutorial , you will be starting with the basics of JSON Syntax including objects, arrays, values, keys, and string formats, and going into the advanced JSON topics including parsing JSON in various programming languages, using JSON for web APIs, and data handling of large JSON datasets.

By the end, you’ll gain a solid understanding of JSON and how to use it effectively

What is JSON?

JSON , short for JavaScript Object Notation , makes sharing data simple and straightforward. Created by Douglas Crockford, it’s designed for easy reading and writing by humans, and easy parsing and generating by computers. Its main goal was to make a text format that’s good at showing simple data like lists and text, and really useful for websites.

JSON is special because it’s very clear and easy to use, and it uses a “.json” file ending to show that a file is in this format. This makes JSON great for both people and programs to work with.

Why use JSON?

JSON is used in a variety of contexts, primarily for data interchange between servers and web applications: Here are the reasons:

Language Independence : Though it is derived from a subset of JavaScript, yet it is Language independent . Thus, the code for generating and parsing JSON data can be written in any other programming language.
Human-readable Format : It is Human-readable and writable.
Lightweight Data Interchange Format : It is a lightweight text-based data interchange format which means, it is simpler to read and write when compared to XML.
Easy Parsing and Generation : Allows conversion of parse JSON data into native data structures and vice versa easily, simplifying the process of working with data.

JSON Syntax

In JSON , data is primarily stored in two structures: objects and arrays . Here’s a detailed breakdown of the syntax for each:

1. Using ‘Objects’

Objects in JSON are collections of key/value pairs enclosed in curly braces {} .
Each key is a string (enclosed in double quotes " ) followed by a colon : , and the key/value pairs are separated by commas (,) .

2. Using ‘Arrays’

Arrays are ordered lists of values, enclosed in square brackets [] .
Values within an array are separated by commas (,) .

Basic JSON Example

Getting started with json.

Before getting started with JSON, you must have basic programming knowledge and familiarity with data structures like objects and arrays.

Useful JSON Tools

Effortlessly transform JSON to CSV with our user-friendly tools! Simplify your data handling and analysis. Use our JSON Formatter and Validator to format and beautify your JSON code.

Advantages of JSON

It stores all the data in an array so that data transfer makes easier. That’s why it is the best for sharing data of any size even audio, video, etc.
Its syntax is very small, easy, and light-weighted that’s the reason it executes and responds in a faster way.
It has a wide range for browser support compatibility with the operating systems. It doesn’t require much effort to make it all browser compatible.
On the server-side parsing is the most important part that developers want. If the parsing will be fast on the server side then the user can get a fast response, so in this case, JSON server-side parsing is the strong point compared to others.

Limitations of JSON

The main limitation is that there is no error handling . If there was a slight mistake in the script then you will not get the structured data.
It becomes quite dangerous when you used it with some unauthorized browsers . Like JSON service return a JSON file wrapped in a function call that has to be executed by the browsers if the browsers are unauthorized then your data can be hacked.
It has limited supported tools that we can use during the development.

Frequently Asked Questions About JSON

What is the full-form json.

“JSON” stands for “ JavaScript Object Notation ” and is a lightweight data format used for easy exchange of data between different systems.

What is JSON used for?

JSON is used for data interchange between servers and web applications, configuration files, and storing structured data.

What is the basic structure of JSON?

JSON structure is made of k ey-value pairs within objects {} and ordered lists of values within arrays [] .

What are the types of JSON?

In JSON, “types” typically refer to the values that can be represented within the JSON format. JSON supports the following data types: String : A sequence of characters, enclosed in double quotes. Example : "Hello, world!" Number : Integer or floating-point numbers. Example : 42 or 3.14 Object : An unordered collection of key-value pairs, enclosed in curly braces {} . Example : {"name": "John", "age": 30} Array : An ordered list of values, enclosed in square brackets [] . Example : ["apple", "banana", "cherry"] Boolean : Represents true or false values. Example : true or false Null : Represents a null value, indicating the absence of any value. Example : null

Is JSON Slowing Down Our Apps?

In some case, especially for large data sets. JSON is easy to read but larger and requires more processing than some alternatives

Why is JSON preferred over XML?

JSON is more lightweight, easier to read and write, and faster to parse than XML.

What are the alternative of JSON?

The best choice depends on your needs: data size, readability, and development time. Here are some alternatives of json: Protocol Buffers : Smaller, faster format, good for various languages. MessagePack : Efficient for real-time data exchange. Custom Binary Formats : Fastest option, but requires more development effort.

Please Login to comment...

Improve your Coding Skills with Practice

What kind of Experience do you want to share?

JSON in Python: How To Read, Write, and Parse

JSON, short for JavaScript Object Notation , is an open standard. Although its name doesn’t imply so, it is a language-independent data format. With Python’s JSON library, we can read, write, and parse JSON to both store and exchange data using this versatile data format. It’s a prevalent data format because it is easy to read and write for humans as well, although not as easy as YAML !

Working with JSON in Python is super easy! Python has two data types that, together, form the perfect tool for working with JSON in Python: dictionaries and lists . In this article, I’ll show you how to use the built-in Python JSON library. In addition, we’ll take a look at JSON5: an extension to JSON that allows things like comments inside your JSON documents.

Table of Contents

1 Importing the built-in JSON library
2 How to parse JSON in Python
3 Encoding JSON with json.dumps
4 Pretty printing JSON on the command line
5 How to read a JSON file in python
6 How to write JSON to a file in Python
7 JSON5 vs. JSON
8 Frequently Asked Questions
9 Keep learning

Importing the built-in JSON library

Python ships with a powerful and elegant JSON library to help you decode and encode JSON. You can import the module with:

This library is part of Python, so you don’t need to install it with the Pip package manager .

How to parse JSON in Python

Parsing a string of JSON data, also called decoding JSON, is as simple as using json.loads(…) . Loads is short for load string.

It converts:

objects to dictionaries
arrays to lists,
booleans , integers , floats, and strings are recognized for what they are and will be converted into the correct types in Python
Any null will be converted into Python’s None type

Here’s an example of json.loads in action:

If the interactive example above doesn’t work (it’s still in beta), here’s a more static example instead:

The output might look like a string, but it’s actually a dictionary that you can use in your code as explained on our page about Python dictionaries . You can check for yourself:

Encoding JSON with json.dumps

Encoding JSON data with Python’s json.dumps is just as easy as decoding. Use json.dumps (short for ‘dump to string’) to convert a Python object consisting of dictionaries , lists , and other native types into a string:

Here’s the same example, in case the above interactive example doesn’t work in your browser:

This is the same document, converted back to a string! If you want to make your JSON document more readable for humans, use the indent option. It will nicely format the JSON, using space characters:

Pretty printing JSON on the command line

Python’s JSON module can also be used from the command line. It will both validate and pretty-print your JSON:

You may also be interested in using the jq-tool for this though!

How to read a JSON file in python

Besides json.loads , there’s also a function called json.load (without the s). It will load data from a file, but you have to open the file yourself. If you want to read the contents of a JSON file into Python and parse it, use the following example:

How to write JSON to a file in Python

The json.dump function is used to write data to a JSON file. You’ll need to open the file in write mode first:

JSON5 vs. JSON

JSON5 is an extension of JSON. The main advantage of JSON5 over JSON is that it allows for more human-readable and editable JSON files. Notable JSON5 features are:

single-line and multi-line comments
trailing commas in objects and arrays
single-quoted strings

For machine-to-machine communication, I recommend using the built-in JSON library. However, when using JSON as a configuration file, JSON5 is recommended, mainly because it allows for comments.

Python does not support JSON5 natively. To read and write JSON5, we’ll need to pip install one of the following packages:

PyJSON5 : a library that uses the official JSON5 C library, making it the fastest option to use.
json5 : a pure Python implementation, confusingly called pyjson5 as well on in their documentation. According to the author, the library is slow.

I recommend the first (fast) option, but unless you are parsing hundreds or thousands of documents, the speed advantage will be negligible.

Both libraries offer functions that mimic the Python JSON module, making it super easy to convert your code to JSON5. You could, for example, do an import pyjson5 as json but I recommend making it more explicit that you’re using json5 as show in the following example:

To make it extra clear that you’re using JSON5, you can also use the extension .json5 . While you’re at it, search the marketplace of your code editor for a JSON5 plugin. E.g., VSCode has one or two.

Frequently Asked Questions

Simply use the methods described above. The json.dump and json.dumps functions accept both dictionaries and lists

Similar to arrays, so use json.dump or json.dumps on the dictionary.

The dump and dumps functions both accept an option called sort_keys, for example: json.dumps(data, sort_keys=True) .

By default: no. The library outputs ASCII and will convert characters that are not part of ASCII. If you want to output Unicode, set ensure_ascii to False. Example: json.dumps(data, ensure_ascii=False)

Keep learning

If you’re looking for a format that is easy to write for humans (e.g.: config files), read our article on reading and writing YAML with Python .
JMESPath is a query language for JSON. JMESPath in Python allows you to obtain the data you need from a JSON document or dictionary easily.
If you need to parse JSON on the command-line , try our article on a tool called jq!
Get a refresher on opening, writing, and reading files with Python .

Get certified with our courses

Learn Python properly through small, easy-to-digest lessons, progress tracking, quizzes to test your knowledge, and practice sessions. Each course will earn you a downloadable course certificate.

Python YAML: How to Load, Read, and Write YAML
Python List Comprehension: Tutorial With Examples
PyInstaller: Create An Executable From Python Code
Python Tuple: How to Create, Use, and Convert

Python Newsletter

Before you leave, you may want to sign up for my newsletter.

Tips & Tricks News Course discounts

No spam & you can unsubscribe at any time.

JSON Basics For Beginners-With Examples and Exercises

Having a good working knowledge of JSON, and how to create and use JSON data will be very important in developing IOT applications.

The tutorial is split into two sections. The first section we look at creating JSON data and in the second section we look at converting JSON data into JavaScript objects and extracting values from the data.

In this tutorial and Workbook you will learn:

What JSON is and Why it is Used.
Basic JSON format .

Sending and Receiving JSON Data

Creating json formatted data, create json string examples.

How to convert JSON to JavaScript and vice versa .
How to create complex JSON strings using the online JSON editor .
How to extract data from JavaScript objects and arrays .

What is JSON ( JavaScript Object Notation )?

JSON is a format for encoding data in human readable format for storing and sending over a network.

Although it started in JavaScript it is used in all modern programming languages.

Why it is Used?

JSON is used because it makes it easy to store and transfer JavaScript arrays and objects as text data.

JSON Format Overview

JSON stores data as:

key/value pairs
Data is separated using commas
Text data is enclosed in double quotes
Numerical data has no quotes.
Arrays are enclosed in square brackets []
Objects are enclosed in curly brackets {}
The output is a text string

Data from devices and sensors in IOT applications is normally sent in JSON format .

So the application program on the sensor has to package the data into a JSON string , and the receiving application has to convert the JSON string into the original data format e.g. object, array etc .

All major programming languages have functions for doing this.

You can create a JSON string manually but when coding complex data structures in it common to use a JSON editor .

In addition to verify that the encoding is correct it is also common to use a JSON validator .

We will be looking at examples and doing exercises involving both later in this tutorial.

The exercises consist of a worked example(s) and questions to test your understanding.

Worked Example 1:

Convert the following JavaScript array to JSON.

var names= [“james”, “jake”];

[“james”, “jake”]

Worked Example 2:

Convert the following JavaScript object to JSON

var power={voltage: 250,current: 12}

‘{“voltage”: 250,”current”: 12}’

Note: In JSON numbers do not need quotes

Worked Example 3:

var power={voltage: “250”,current: “12”};

‘{“voltage”: “250”, “current”: “12”}’

Note: This time even though they are numbers they are represented as strings in JavaScript and so they need quotes.

Answers to all questions are at the end.

Q1 -The following JSON string consists of

‘[{“sensor”: “sensor1”, “temperature”: 22, “humidity”: 80}]’

An Array inside an object
An object inside and array

Q2 – The JSON string consists of:

‘[{“sensor”: “sensor1”, “temperature”: 22, “humidity”: 80},{“sensor”: “sensor2”, “temperature”: 22, “humidity”: 65}]’

An array with two objects
An object with two arrays

Q3 – The JSON string consists of:

‘[{“sensor”: “sensor1″,”temperature”: 24, “humidity”: 69},{“sensor”: sensor2, “temperature”: 22, “humidity”: 65}]’

How to Create Complex JSON Strings Using the Online JSON Editor

You can use the online JSON editor tool for creating more complex JSON structures.

To illustrate how to use the JSON editor Tool we are going to create a JSON string with an array of 3 objects.The objects are:

Object 1 contains the following key/value pairs:

name=John,DOB=1/1/2000,Age=20

Object 2 contains the following key/value pairs:

name=Jim,DOB=21/2/1990,Age=30

Object 3 contains the following key/value pairs: name=Jane,DOB=6/11/1958,Age=61

Video- Using the Online JSON editor

Converting JSON to JavaScript and Extracting Data

Although you can extract data from a JSON string using JSONata the most common method is to convert it to a JavaScript object, and that is what we cover here.

To convert a JSON string to a JavaScript object you use the JSON parse function.

Object= JSON.parse(JSONstring)

Once the JSON data is placed into a JavaScript Object you can now use normal JavaScript methods and functions to extract elements of that data.

We will start using the simple JavaScript object we saw earlier.

var power={voltage: “240”,current: “1”}

To extract the voltage we use either the dot form or the square bracket.

var voltage=power.voltage or

var voltage=power[“voltage”]

var data=[ { sensor: ‘sensor1’, temperature: 21, humidity: 67 },

[{ sensor: ‘sensor2’, temperature: 22, humidity: 62 } ]

This time we have an array of two objects.

var sensor= data[0].sensor

Returns sensor1

var sensor= data[1].hunidity

Note: Arrays start at 0

This time we have an object containing an array :

sensor={ results: [ 1, 21, 34, 21 ] }

To access the 2 element in the results array we use:

var r= sensor.results[1]

Using the Node.js Command Line

When working on decoding JSON strings I often find it easier to paste the string into a node.js command line and decode it there.

The examples below show screen shots using the node.js command prompt for converting to and from JSON strings to JavaScript Objects.

JSON And JavaScript

There are two functions that are used for converting data from JavaScript to JSON and from JSON to JavaScript . They are:

JSON.stringify (JavaScript object)
JSON.parse (JSON string)

Example: JavaScript Array to JSON String

Example: JSON to JavaScript

Below shows the JSON strings b and d being converted back to JavaScript.

Answers to Questions

Question 1: D

Question 2: A

Question 2: B – Missing quotes on sensor2 .

JSON is used extensively in web and IOT applications and is a very easy method for storing and transferring complex data as text.

All major programming languages have functions for encoding and decoding JSON data

JSON WorkBook

If you want more practise with working with JSON and JavaScript then you might be interested in my workbook.

JSON formatter and Validator
Another JSON Formatter and Validator
Using HTTP APIs for IOT
Using MQTT APIs for IOT

One comment

format json you can try https://www.jsonformatting.com/

JSON Formatter

JSON Formatter and JSON Validator help to auto format JSON and validate your JSON text. It also provides a tree view that helps to navigate your formatted JSON data.

It helps to validate JSON online with Error Messages.
It's the only JSON tool that shows the image on hover on Image URL in a tree view.
It's also a JSON Beautifier that supports indentation levels: 2 spaces, 3 spaces, and 4 spaces.
Supports Printing of JSON Data.
JSON File Formatter provides functionality to upload JSON file and download formatted JSON File. This functionality helps to format json file.
95% of API Uses JSON to transfer data between client and server. This tools can works as API formatter.
Supports JSON Graph View of JSON String which works as JSON debugger or corrector and can format Array and Object.
Stores data locally for the last JSON Formatted in Browser's Local Storage. This can be used as notepad++ / Sublime / VSCode alternative of JSON beautification.
This JSON online formatter can also work as JSON Lint .
Use Auto switch to turn auto update on or off for beautification.
It uses $.parseJSON and JSON.stringify to beautify JSON easy for a human to read and analyze.
Download JSON, once it's created or modified and it can be opened in Notepad++, Sublime, or VSCode alternative.

Know more about JSON :

How to Create JSON File?
What is JSON?
JSON Example with all data types including JSON Array.
Python Pretty Print JSON
Read JSON File Using Python
Validate JSON using PHP
Python Load Json From File

Online JSON Formatter and Online JSON Validator provide JSON converter tools to convert JSON to XML , JSON to CSV , and JSON to YAML also JSON Editor , JSONLint, JSON Checker, and JSON Cleaner.

Free JSON Formatting Online and JSON Validator work well in Windows, Mac, Linux, Chrome, Firefox, Safari, and Edge.

JSON Example:

Json validator.

JSON Validator Online checks the integrity/syntax of the JSON data based on JavaScript Object Notation (JSON) Data Interchange Format Specifications (RFC).

It's super easy to find the error when line numbers are highlighted with an in-detail error description.
Use Screwdriver icon to as JSON Fixer to repair the error.
To validate JSON you just need internet and no need to install any software.
Your JSON Data gets validated in the browser itself.

This JSON Lint tool provides fast and without sign up, user can checks the JSON data's validity.

Why JSON FORMATTER?

Why format json online, how do i format a json file, how to use json formatter with url, is login required to save json data, have you accidentally saved your json data, load external data, save online.

Skip to content
Accessibility Policy
QUICK LINKS
Oracle Cloud Infrastructure
Oracle Fusion Cloud Applications
Oracle Database
Download Java
Careers at Oracle

Create an Account

Oracle’s new JSON relational capability helps solve a big IT challenge

JSON Relational Duality Views bring JSON and relational models together for developers. It’s a revolutionary advancement—here’s why.

John Foley | April 17, 2024

The world of application development is about to be transformed. An Oracle innovation, a standard feature in Oracle Database 23c, bridges a long-standing gap between relational databases and object-oriented programming.

Developers, for the first time, are able to build applications with their favorite object-oriented tools, while automatically and transparently benefiting from the relational database’s underlying capabilities, such as concurrency controls and ACID (atomicity, consistency, isolation, and durability) transactions.

It’s a major advance, yet one with no learning curve.

This stroke of database genius is called JSON Relational Duality Views. That name should warm the hearts of database administrators and development teams alike because it unites JSON and relational—two of the most widely used technologies—in a singular way. But it’s also a technical term that may need to be unpacked for business managers. So let’s start with a short and simple explanation.

Bridging JSON and relational models

JSON, which stands for JavaScript Object Notation, is a 20-year-old data transfer format and industry standard. JSON is nearly synonymous with document databases, but it’s not exclusive to them. Oracle has supported JSON natively in Oracle Database since 2014. (For more on JSON and how it is used, check out the article “What Is JSON?” )

So what’s new? The breakthrough with JSON Relational Duality Views is that developers can take advantage of both the JSON and relational models in one fell swoop. Using object-oriented programming, they can think and act in familiar ways with JSON documents for data access when building applications. At the same time, the system retains the relational structure for data storage.

That’s huge because it combines the goodness of the relational model—data is “normalized” in rows and columns for consistency and integrity—with the look, feel, and useability of JSON documents. Put simply, data is stored in relational format and accessed in document format.

It’s JSON in, JSON out. Gerald Venzl Senior Director of Product Management, Oracle

This unified experience is key because enterprise data management has long been bifurcated. On one hand, CIOs and CTOs have put their faith—and years of investment—in relational database management systems such as Oracle Database to help ensure the highest levels of performance and reliability. On the other, developers have gravitated to the object-oriented paradigm because it’s a more intuitive way to build applications.

As a result, many IT departments use relational databases for mission-critical workloads and document databases with object-oriented programming for others. That makes sense for some use cases, but it’s inefficient. With JSON Relational Duality Views, this kind of multipronged approach is no longer necessary.

Why is that so beneficial?

One issue with document databases is that information is stored redundantly due to the hierarchical nature of JSON documents. That can lead to inconsistencies as data must be updated in multiple places. With JSON Relational Duality Views, data is stored once—in relational tables, where it is accessed, written, and modified. This helps bring consistency even when multiple apps use the same data, such as name, address, or payment information.

Oracle customers will appreciate that JSON Relational Duality Views benefits from the other capabilities of Oracle Database 23c, such as replication, integration with database queries, and ACID transactions. And, in practice, it does that without a trade-off in performance compared with document databases.

Seamless data infrastructure

As someone who covers the full tech stack, from microprocessors to enterprise applications, I tend to view new technologies through the lens of relative complexity. Does a new capability further complicate today’s already-complex IT environment? Or does it automate and simplify?

JSON Relational Duality Views can reduce complexity by streamlining data infrastructure and making life easier for DBAs and developers. Here’s a detailed view of how it works: It transforms incoming JSON documents into rows and columns in the relational database. Then, when queried, the database composes and returns a JSON document.

“It’s JSON in, JSON out,” says Gerald Venzl, Oracle senior director of product management, who briefed me on the new technology.

When a document is updated, Oracle Database 23c will detect the changes and automatically modify the rows that have changed. Data isn’t duplicated.

“You get the power of consistency,” says Venzl.

These capabilities can be used for any data types—spatial, graph, or relational—and by any app, written in any language. In other words, JSON Relational Duality Views is easy to implement.

As you can see, there are many ways that it can improve your organization’s database and development environment.

JSON Relational Duality Views

JSON Relational Duality Views promises to be a transformational new capability for the following reasons:

Combines the power of object-oriented programming with the reliability of the relational model
Provides efficiency and speed for creating new applications that can combine many data types and address more use cases
Helps reduce database and data sprawl by minimizing the need for document and other special-purpose databases
Appeals to developers because it can let them work with their preferred object-oriented programming tools
Modernizes and helps protect your data management infrastructure investment

Oracle demonstrated JSON Relational Duality Views for the first time at Oracle CloudWorld 2023.

“You get the best of everything—the consistency and query-ability of relational, with the power and simplicity of JSON,” explained Juan Loaiza, Oracle executive vice president of mission-critical database technologies. “This is going to be an industry-wide transition. It’s the next generation of data management and data science.”

For business and technology leaders and their teams, it’s a welcome new way of working. They no longer must choose between the object-oriented programming they love and the relational databases they trust. It’s the best of both worlds—or multiple worlds—as developers combine data types in Oracle’s converged database.

John Foley is editor of the Cloud Database Report and a vice president with Method Communications.

View more Oracle Connect articles

Vectors enable businesses to augment the LLMs used for generative AI. Here’s why the new vector data type should live in your existing database.

JSON Relational Duality is a landmark capability in Oracle Database 23c providing game-changing flexibility and simplicity for Oracle Database developers.

JS Tutorial

Js versions, js functions, js html dom, js browser bom, js web apis, js vs jquery, js graphics, js examples, js references, javascript json.

JSON is a format for storing and transporting data.

JSON is often used when data is sent from a server to a web page.

What is JSON?

JSON stands for J ava S cript O bject N otation
JSON is a lightweight data interchange format
JSON is language independent *
JSON is "self-describing" and easy to understand

* The JSON syntax is derived from JavaScript object notation syntax, but the JSON format is text only. Code for reading and generating JSON data can be written in any programming language.

JSON Example

This JSON syntax defines an employees object: an array of 3 employee records (objects):

The JSON Format Evaluates to JavaScript Objects

The JSON format is syntactically identical to the code for creating JavaScript objects.

Because of this similarity, a JavaScript program can easily convert JSON data into native JavaScript objects.

JSON Syntax Rules

Data is in name/value pairs
Data is separated by commas
Curly braces hold objects
Square brackets hold arrays

JSON Data - A Name and a Value

JSON data is written as name/value pairs, just like JavaScript object properties.

A name/value pair consists of a field name (in double quotes), followed by a colon, followed by a value:

JSON names require double quotes. JavaScript names do not.

JSON Objects

JSON objects are written inside curly braces.

Just like in JavaScript, objects can contain multiple name/value pairs:

JSON Arrays

JSON arrays are written inside square brackets.

Just like in JavaScript, an array can contain objects:

In the example above, the object "employees" is an array. It contains three objects.

Each object is a record of a person (with a first name and a last name).

Converting a JSON Text to a JavaScript Object

A common use of JSON is to read data from a web server, and display the data in a web page.

For simplicity, this can be demonstrated using a string as input.

First, create a JavaScript string containing JSON syntax:

Then, use the JavaScript built-in function JSON.parse() to convert the string into a JavaScript object:

Finally, use the new JavaScript object in your page:

You can read more about JSON in our JSON tutorial .

COLOR PICKER

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail: [email protected]

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail: [email protected]

JSON for Beginners – JavaScript Object Notation Explained in Plain English

What is JSON?

JSON Data Format Examples

How to Use JSON Data as a String Value

JavaScript Objects and JSON are NOT the Same

How to Convert JSON to a JavaScript Object, and vice-versa

How to Convert JSON Data to a JavaScript Object

How to Convert a JavaScript Object to JSON Data

How to Handle JSON Errors like "Unexpected token u in JSON at position 1"?

Before We End...

A Beginner's Guide to JSON with Examples

You might also like...

Buy me a coffee ☕

✨ Learn to build modern web applications using JavaScript and Spring Boot

JSON Tutorial – Introduction, Structure, Syntax Rules, and Data Exchange

What is JSON?

Structure of a JSON Object:

JSON Example:

JSON Syntax Rules:

JavaScript JSON built-in library:

Data Exchange with JSON:

Programming Languages Support:

A beginner's guide to JSON, the data format for the internet

What JSON looks like

Using JSON in API calls

Using JSON files in JavaScript

Accessing and modifying JavaScript objects

Comparison to YAML and XML

Signed JSON

Other notes

No, really, what is JSON?

JSON structure

Arrays as JSON

Active learning: Working through a JSON example

Getting started

Loading our JSON

Populating the header

Converting between objects and text

Document Tags and Contributors

How-To Geek

Quick Links

No Comments

No References

JSON methods, toJSON

JSON.stringify

Excluding and transforming: replacer

Formatting: space

Custom “toJSON”

Using reviver

Turn the object into JSON and back

Exclude backreferences

Lesson navigation

JSON Tutorial

What is JSON?

Why use JSON?

JSON Syntax

1. Using ‘Objects’

2. Using ‘Arrays’

Basic JSON Example

Useful JSON Tools

Advantages of JSON

Limitations of JSON

Frequently Asked Questions About JSON

What is JSON used for?

What is the basic structure of JSON?

What are the types of JSON?

Is JSON Slowing Down Our Apps?

Why is JSON preferred over XML?

What are the alternative of JSON?

Please Login to comment...

Improve your Coding Skills with Practice

What kind of Experience do you want to share?

JSON in Python: How To Read, Write, and Parse

Importing the built-in JSON library

How to parse JSON in Python

Encoding JSON with json.dumps

Pretty printing JSON on the command line

How to read a JSON file in python

How to write JSON to a file in Python

JSON5 vs. JSON