JavaScript JSON:What is JSON?

JSON, which stands for JavaScript Object Notation, is a lightweight data-interchange format. It is easy for humans to read and write, and it is easy for machines to parse and generate. 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.

JSON is often used to transmit data between a server and web application, as an alternative to XML (eXtensible Markup Language). It is also commonly used for configuration files and data storage, as it provides a simple and standardized way to represent structured data.

JSON data is represented as key-value pairs, where keys are strings and values can be strings, numbers, objects, arrays, booleans, or null.

Here’s a simple example of JSON:

{
"name": "Omar AboBakr",
"age": 20,
"city": "Cairo",
"isStudent": true,
"courses": ["Math", "Computer Science"]
}

In this example:

“name”, “age”, “city”, “isStudent” are keys.
“Omar AboBakr”, 20, “Cairo”, true are corresponding values.
“courses” has an array value containing two strings.

In JavaScript, you can work with JSON using the JSON object, which provides methods like JSON.stringify() to convert a JavaScript object to a JSON string and JSON.parse() to convert a JSON string back into a JavaScript object.

// Converting a JavaScript object to a JSON string
const person = {
name: "John Doe",
age: 30,
city: "New York",
isStudent: false,
courses: ["Math", "Computer Science"]
};

const jsonString = JSON.stringify(person);
console.log(jsonString);

// Converting a JSON string back to a JavaScript object
const parsedPerson = JSON.parse(jsonString);
console.log(parsedPerson);

complete code example in html with explanation

Below is a simple HTML example that includes JavaScript code to demonstrate the use of JSON. In this example, we have a form where a can input their information, and when they click a button, the entered data is converted to JSON format and displayed.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON Example</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Enter Your Information</h2>

<form id="infoForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required><br>

<label for="age">Age:</label>
<input type="number" id="age" name="age" required><br>

<label for="city">City:</label>
<input type="text" id="city" name="city" required><br>

<label for="isStudent">Are you a student?</label>
<input type="checkbox" id="isStudent" name="isStudent"><br>

<button type="button" onclick="submitForm()">Submit</button>
</form>

<h2>JSON Result</h2>
<pre id="jsonResult"></pre>

<script>
function submitForm() {
// Get values from the form
const name = document.getElementById('name').value;
const age = parseInt(document.getElementById('age').value);
const city = document.getElementById('city').value;
const isStudent = document.getElementById('isStudent').checked;

// Create a JavaScript object
const person = {
name: name,
age: age,
city: city,
isStudent: isStudent
};

// Convert the JavaScript object to a JSON string
const jsonString = JSON.stringify(person, null, 2);

// Display the JSON result
document.getElementById('jsonResult').innerText = jsonString;
}
</script>

</body>
</html>

Explanation:

The HTML document contains a form with input fields for name, age, city, and a checkbox for whether the person is a student.
There’s a button with an onclick attribute that calls the submitForm function when clicked.
The submitForm function retrieves values from the form, creates a JavaScript object (person), and then uses JSON.stringify to convert that object to a formatted JSON string.
The resulting JSON string is displayed in a <pre> element with the id jsonResult.
The styling in the <style> element is just for better presentation.
When you enter information in the form and click the “Submit” button, you’ll see the corresponding JSON representation displayed below the form.

JSON Syntax Rules

JSON (JavaScript Object Notation) has a specific syntax that must be followed.

Here are the key syntax rules for JSON:

Data is in Key/Value Pairs:

JSON data is represented as key/value pairs.
Each key must be a string, and it must be followed by a colon (:).
Values can be strings, numbers, objects, arrays, booleans, or null.

{
"key1": "value1",
"key2": 42,
"key3": true,
"key4": null
}

Objects are Enclosed in Curly Braces:

The entire JSON structure is enclosed in curly braces {}.
Inside the curly braces, key/value pairs are separated by commas.
json

{
"name": "John Doe",
"age": 30,
"city": "New York"
}

Arrays are Ordered Lists:

Arrays in JSON are ordered lists of values.
Values inside arrays can be of any JSON data type.
Arrays are enclosed in square brackets [] and elements are separated by commas.
json

{
"fruits": ["apple", "orange", "banana"],
"numbers": [1, 2, 3, 4, 5]
}

Strings are Enclosed in Double Quotes:

String values must be enclosed in double quotes.
json

{
"name": "John Doe",
"city": "New York"
}

Numbers can be Integers or Floats:

Numeric values can be integers or floating-point numbers.
json

{
"age": 25,
"height": 5.9
}

Boolean Values:

Boolean values are represented as true or false.
json

{
"isStudent": true,
"hasJob": false
}

Null Represents Empty Value:

The value null is used to represent an empty value or absence of data.
json

{
"middleName": null
}

Whitespace is Ignored:

JSON parsers ignore whitespace, so you can use spaces, tabs, and newlines to format the JSON for better human readability.
json

{
"name": "John Doe",
"age": 30,
"city": "New York"
}

These are the fundamental syntax rules for JSON. Adhering to these rules ensures that the data can be accurately parsed and processed by JSON parsers in various programming languages.

complete code example in html with explanation

Here’s a complete HTML code example that includes JavaScript to demonstrate the use of JSON. In this example, we have a form where a can input information about books, and when they click a button, the entered data is converted to JSON format and displayed.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON Example</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Enter Book Information</h2>

<form id="bookForm">
<label for="title">Title:</label>
<input type="text" id="title" name="title" required><br>

<label for="author">Author:</label>
<input type="text" id="author" name="author" required><br>

<label for="publishedYear">Published Year:</label>
<input type="number" id="publishedYear" name="publishedYear" required><br>

<button type="button" onclick="submitForm()">Submit</button>
</form>

<h2>JSON Result</h2>
<pre id="jsonResult"></pre>

<script>
function submitForm() {
// Get values from the form
const title = document.getElementById('title').value;
const author = document.getElementById('author').value;
const publishedYear = parseInt(document.getElementById('publishedYear').value);

// Create a JavaScript object
const book = {
title: title,
author: author,
publishedYear: publishedYear
};

// Convert the JavaScript object to a JSON string
const jsonString = JSON.stringify(book, null, 2);

// Display the JSON result
document.getElementById('jsonResult').innerText = jsonString;
}
</script>

</body>
</html>

Explanation:

The HTML document contains a form with input fields for the title, author, and published year of a book.
There’s a button with an onclick attribute that calls the submitForm function when clicked.
The submitForm function retrieves values from the form, creates a JavaScript object (book), and then uses JSON.stringify to convert that object to a formatted JSON string.
The resulting JSON string is displayed in a <pre> element with the id jsonResult.
The styling in the <style> element is just for better presentation.
When you enter information in the form and click the “Submit” button, you’ll see the corresponding JSON representation displayed below the form.
This example demonstrates a simple use case of using JSON to represent book information entered by a user .

JSON Data – A Name and a Value

In JSON, data is represented as key/value pairs. A key is a string that represents a name, and it is followed by a colon (:), which separates the key from its corresponding value. The value can be a string, number, object, array, boolean, or null.

Here’s an example of JSON data with a name (key) and a value:

json

{
"name": "John Doe",
"age": 30,
"city": "New York"
}

In this example:

“name”, “age”, and “city” are keys.
“John Doe”, 30, and “New York” are their corresponding values.
Each key/value pair is separated by a comma, and the entire data structure is enclosed in curly braces {}.
The colon : separates the key and its value.

This basic structure allows you to represent structured data in a way that is both human-readable and machine-readable. The use of keys and values makes it easy to organize and retrieve information.

complete code in html with explanation

Below is a complete HTML code example that includes JavaScript to demonstrate JSON data with a name and a value.
In this example, we have a simple form where a can input information about a person, and when they click a button, the entered data is converted to JSON format and displayed.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON Data Example</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Enter Person Information</h2>

<form id="personForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required><br>

<label for="age">Age:</label>
<input type="number" id="age" name="age" required><br>

<label for="city">City:</label>
<input type="text" id="city" name="city" required><br>

<button type="button" onclick="submitForm()">Submit</button>
</form>

<h2>JSON Data Result</h2>
<pre id="jsonData"></pre>

<script>
function submitForm() {
// Get values from the form
const name = document.getElementById('name').value;
const age = parseInt(document.getElementById('age').value);
const city = document.getElementById('city').value;

// Create a JavaScript object with name/value pairs
const person = {
"name": name,
"age": age,
"city": city
};

// Convert the JavaScript object to a JSON string
const jsonData = JSON.stringify(person, null, 2);

// Display the JSON data result
document.getElementById('jsonData').innerText = jsonData;
}
</script>

</body>
</html>

Explanation:

The HTML document contains a form with input fields for the name, age, and city of a person.
There’s a button with an onclick attribute that calls the submitForm function when clicked.
The submitForm function retrieves values from the form, creates a JavaScript object (person) with name/value pairs, and then uses JSON.stringify to convert that object to a formatted JSON string.
The resulting JSON string is displayed in a <pre> element with the id jsonData.
The styling in the <style> element is just for better presentation.
When you enter information in the form and click the “Submit” button, you’ll see the corresponding JSON representation displayed below the form.
This example demonstrates the concept of JSON data with key/value pairs representing information about a person.

another example

Here’s another example using JSON to represent information about a list of books. The can input the title, author, and published year of a book, and the entered data is then converted to JSON format and displayed.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON Data Example</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Enter Book Information</h2>

<form id="bookForm">
<label for="title">Title:</label>
<input type="text" id="title" name="title" required><br>

<label for="author">Author:</label>
<input type="text" id="author" name="author" required><br>

<label for="publishedYear">Published Year:</label>
<input type="number" id="publishedYear" name="publishedYear" required><br>

<button type="button" onclick="submitForm()">Submit</button>
</form>

<h2>JSON Data Result</h2>
<pre id="jsonData"></pre>

<script>
function submitForm() {
// Get values from the form
const title = document.getElementById('title').value;
const author = document.getElementById('author').value;
const publishedYear = parseInt(document.getElementById('publishedYear').value);

// Create a JavaScript object with name/value pairs
const book = {
"title": title,
"author": author,
"publishedYear": publishedYear
};

// Convert the JavaScript object to a JSON string
const jsonData = JSON.stringify(book, null, 2);

// Display the JSON data result
document.getElementById('jsonData').innerText = jsonData;
}
</script>

</body>
</html>

Explanation:

This HTML document is similar to the previous example, but it now focuses on entering information about books.
The form has input fields for the title, author, and published year of a book.
The submitForm function retrieves values from the form, creates a JavaScript object (book) with name/value pairs, and uses JSON.stringify to convert that object to a formatted JSON string.
The resulting JSON string is displayed in a <pre> element with the id jsonData.
When you enter information in the form and click the “Submit” button, you’ll see the corresponding JSON representation displayed below the form. T
his example demonstrates the use of JSON for representing information about books.

JSON Objects

JSON objects are fundamental data structures in JSON (JavaScript Object Notation).
They consist of key-value pairs, where each key is a string and each value can be a string, number, boolean, object, array, or null.
Objects are enclosed in curly braces {} and can contain zero or more key-value pairs.

Here’s an example of a JSON object:

json

{
"name": "John Doe",
"age": 30,
"city": "New York",
"isStudent": false,
"courses": ["Math", "Computer Science"]
}

In this example:

“name”, “age”, “city”, “isStudent”, and “courses” are keys.
“John Doe”, 30, “New York”, false, and [“Math”, “Computer Science”] are their corresponding values.
Each key-value pair is separated by a comma, and the entire object is enclosed in curly braces {}.
The order of key-value pairs in a JSON object is not guaranteed to be preserved.

You can nest objects within objects to represent hierarchical or nested data structures.

Here’s an example with a nested object:

json

{
"person": {
"name": "Jane Smith",
"age": 25,
"address": {
"city": "Los Angeles",
"state": "CA",
"zipCode": "90001"
}
},
"isStudent": true
}

In this example, the “person” key has a nested object with keys “name,” “age,” and “address.” The “address” key, in turn, has its own nested object.

In JavaScript, you can work with JSON objects using the JSON.parse() method to convert a JSON string into a JavaScript object, and JSON.stringify() to convert a JavaScript object into a JSON string.

Here’s a simple example:

// JSON string
const jsonString = '{"name": "John Doe", "age": 30, "city": "New York"}';

// Convert JSON string to JavaScript object
const jsonObject = JSON.parse(jsonString);

// Access values in the JavaScript object
console.log(jsonObject.name); // Output: John Doe
console.log(jsonObject.age); // Output: 30

// Convert JavaScript object back to JSON string
const jsonStringAgain = JSON.stringify(jsonObject);
console.log(jsonStringAgain);

This JavaScript code demonstrates the conversion between JSON strings and JavaScript objects.

complete example in html with explanation

Here’s a complete HTML example that includes JavaScript to demonstrate JSON objects.
In this example, we have a form where a can input information about a person, and when they click a button, the entered data is converted to a JSON object and displayed.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON Object Example</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Enter Person Information</h2>

<form id="personForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required><br>

<label for="age">Age:</label>
<input type="number" id="age" name="age" required><br>

<label for="city">City:</label>
<input type="text" id="city" name="city" required><br>

<button type="button" onclick="submitForm()">Submit</button>
</form>

<h2>JSON Object Result</h2>
<pre id="jsonObject"></pre>

<script>
function submitForm() {
// Get values from the form
const name = document.getElementById('name').value;
const age = parseInt(document.getElementById('age').value);
const city = document.getElementById('city').value;

// Create a JavaScript object with key/value pairs
const person = {
"name": name,
"age": age,
"city": city
};

// Display the JSON object result
document.getElementById('jsonObject').innerText = JSON.stringify(person, null, 2);
}
</script>

</body>
</html>

Explanation:

The HTML document contains a form with input fields for the name, age, and city of a person.
There’s a button with an onclick attribute that calls the submitForm function when clicked.
The submitForm function retrieves values from the form and creates a JavaScript object (person) with key/value pairs.
The JSON.stringify method is used to convert the JavaScript object into a formatted JSON string.
The resulting JSON string is displayed in a <pre> element with the id jsonObject.
When you enter information in the form and click the “Submit” button, you’ll see the corresponding JSON object displayed below the form.
This example demonstrates the use of JSON objects to represent information about a person.

JSON Arrays

JSON arrays are ordered lists of values.
They are used to represent an ordered sequence of values, and each value in the array can be of any valid JSON data type, including strings, numbers, objects, arrays, booleans, or null.
Arrays in JSON are enclosed in square brackets [], and the values inside the array are separated by commas. Here’s an example of a JSON array:

json

{
"fruits": ["apple", "orange", "banana"],
"numbers": [1, 2, 3, 4, 5],
"people": [
{"name": "John", "age": 30},
{"name": "Jane", "age": 25}
]
}

In this example:

“fruits”, “numbers”, and “people” are keys.
The values associated with these keys are arrays.
The “fruits” array contains strings, the “numbers” array contains integers, and the “people” array contains objects.

How to access elements in a JSON array?

You can access elements in a JSON array using zero-based indexing.

For example, the first element in the “fruits” array is “apple” at index 0.

In JavaScript, you can work with JSON arrays using the JSON.parse() method to convert a JSON string into a JavaScript array, and JSON.stringify() to convert a JavaScript array into a JSON string.

Here’s a simple example in HTML that demonstrates the use of a JSON array:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON Array Example</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Fruits and Numbers</h2>

<div id="jsonArray"></div>

<script>
// JSON string with an array
const jsonString = '{"fruits": ["apple", "orange", "banana"], "numbers": [1, 2, 3, 4, 5]}';

// Convert JSON string to JavaScript object
const jsonObject = JSON.parse(jsonString);

// Access and display elements from the arrays
const fruitsArray = jsonObject.fruits;
const numbersArray = jsonObject.numbers;

// Display the arrays
document.getElementById('jsonArray').innerHTML = `
<p>Fruits: ${fruitsArray.join(', ')}</p>
<p>Numbers: ${numbersArray.join(', ')}</p>
`;
</script>

</body>
</html>

In this example:

The JavaScript code parses a JSON string into a JavaScript object.
It then accesses the arrays within the object and displays the elements in the HTML document.
When you open this HTML file in a browser, it will display a list of fruits and numbers obtained from the JSON array.

Converting a JSON Text to a JavaScript Object

In JavaScript, you can convert a JSON text to a JavaScript object using the JSON.parse() method. This method takes a JSON-formatted string as its parameter and returns a JavaScript object.

Here’s an example demonstrating how to convert a JSON text to a JavaScript object:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Convert JSON to JavaScript Object</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Convert JSON to JavaScript Object</h2>

<pre id="jsonText">{"name": "John Doe", "age": 30, "city": "New York"}</pre>

<h3>Result</h3>

<div id="result"></div>

<script>
// Get the JSON text from the <pre> element
const jsonText = document.getElementById('jsonText').innerText;

// Convert JSON text to JavaScript object
const jsonObject = JSON.parse(jsonText);

// Display the JavaScript object
document.getElementById('result').innerText = JSON.stringify(jsonObject, null, 2);
</script>

</body>
</html>

Explanation:

The HTML document includes a <pre> element containing a JSON-formatted string.
The JavaScript code retrieves the JSON text from the <pre> element using document.getElementById(‘jsonText’).innerText.
It then uses JSON.parse() to convert the JSON text to a JavaScript object (jsonObject).
Finally, the resulting JavaScript object is displayed in the HTML document using JSON.stringify().
When you open this HTML file in a browser, it will show the original JSON text and the corresponding JavaScript object. Note that in this example, the JSON text is directly included in the HTML for simplicity, but in a real-world scenario, you might get the JSON text from an API response or input.

another example

Here’s another example where a JSON text representing an array of books is converted into a JavaScript array of objects:

html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Convert JSON Array to JavaScript Array</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Convert JSON Array to JavaScript Array</h2>

<pre id="jsonArray">[
{"title": "The Catcher in the Rye", "author": "J.D. Salinger", "year": 1951},
{"title": "To Kill a Mockingbird", "author": "Harper Lee", "year": 1960},
{"title": "1984", "author": "George Orwell", "year": 1949}
]</pre>

<h3>Result</h3>

<div id="result"></div>

<script>
// Get the JSON array text from the <pre> element
const jsonArrayText = document.getElementById('jsonArray').innerText;

// Convert JSON array text to JavaScript array
const jsonArray = JSON.parse(jsonArrayText);

// Display the JavaScript array
document.getElementById('result').innerHTML = "<ul>" +
jsonArray.map(book => `<li>${book.title} by ${book.author} (${book.year})</li>`).join('') +
"</ul>";
</script>

</body>
</html>

Explanation:

The HTML document includes a <pre> element containing a JSON-formatted array of books.
The JavaScript code retrieves the JSON array text from the <pre> element using document.getElementById(‘jsonArray’).innerText.
It then uses JSON.parse() to convert the JSON array text to a JavaScript array (jsonArray).
The resulting JavaScript array is displayed in the HTML document by creating an unordered list (<ul>) where each book is represented as a list item (<li>).
When you open this HTML file in a browser, it will show the original JSON array text and the corresponding JavaScript array of book objects.

Application

let’s create a simple web application that allows s to enter information about books using a form. When the submits the form, the entered data will be displayed in both JSON format and as a list. We’ll use JavaScript to handle the form submission and conversion of data.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Book Information App</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
</style>
</head>
<body>

<h2>Enter Book Information</h2>

<form id="bookForm">
<label for="title">Title:</label>
<input type="text" id="title" name="title" required><br>

<label for="author">Author:</label>
<input type="text" id="author" name="author" required><br>

<label for="publishedYear">Published Year:</label>
<input type="number" id="publishedYear" name="publishedYear" required><br>

<button type="button" onclick="submitForm()">Submit</button>
</form>

<h3>JSON Data</h3>
<pre id="jsonData"></pre>

<h3>Book List</h3>
<ul id="bookList"></ul>

<script>
function submitForm() {
// Get values from the form
const title = document.getElementById('title').value;
const author = document.getElementById('author').value;
const publishedYear = parseInt(document.getElementById('publishedYear').value);

// Create a JavaScript object with book information
const book = {
"title": title,
"author": author,
"publishedYear": publishedYear
};

// Convert the JavaScript object to a JSON string
const jsonString = JSON.stringify(book, null, 2);

// Display the JSON data
document.getElementById('jsonData').innerText = jsonString;

// Display the book in the list
const bookList = document.getElementById('bookList');
const listItem = document.createElement('li');
listItem.textContent = `${title} by ${author} (${publishedYear})`;
bookList.appendChild(listItem);
}
</script>

</body>
</html>

Explanation:

The HTML document contains a form with input fields for the title, author, and published year of a book.
The form has a button with an onclick attribute that calls the submitForm function when clicked.
The submitForm function retrieves values from the form, creates a JavaScript object (book) with key/value pairs, and uses JSON.stringify to convert that object to a formatted JSON string.
The resulting JSON string is displayed in a <pre> element with the id jsonData.
The book information is also displayed in an unordered list (<ul>) with the id bookList. Each submitted book creates a new list item (<li>) in the list.
When you enter information in the form and click the “Submit” button, you’ll see the entered book information displayed as both JSON data and in a list format on the web page. This example illustrates the practical use of JSON in a simple web application.

Quiz about JSON

Question 1: What does JSON stand for?

A. JavaScript Object Notation
B. Java Symbolic Notation
C. JavaScript Oriented Notation
D. Java Scripted Object Naming

Question 2: What is the purpose of JSON?

A. To style HTML elements
B. To represent structured data
C. To define web page layouts
D. To create dynamic web pages

Question 3: In JSON, what is a key?

A. The value associated with an item
B. An array element
C. A string that represents a name
D. A variable in JavaScript

Question 4: How are key-value pairs separated in a JSON object?

A. By a semicolon (;)
B. By a colon (:)
C. By an equal sign (=)
D. By a comma (,)

Question 5: Which symbol is used to enclose a JSON object?

A. ( )
B. [ ]
C. { }
D. < >

Question 6: What is the purpose of JSON arrays?

A. To define functions in JavaScript
B. To store key-value pairs
C. To represent an ordered list of values
D. To create conditional statements

Question 7: How is a JSON array different from a JSON object?

A. Arrays are enclosed in curly braces, and objects in square brackets
B. Arrays can only contain strings, and objects can only contain numbers
C. Arrays are unordered, and objects are ordered
D. Arrays use colons to separate elements, and objects use commas

Question 8: Which method is used to convert a JavaScript object to a JSON string?

A. JSON.stringify()
B. JSON.parse()
C. convertToJson()
D. stringifyJSON()

Question 9: In JSON, what represents an empty or null value?

A. undefined
B. NaN
C. empty string
D. null

Question 10: How can you access the values in a JavaScript array?

A. Using dot notation
B. Using square bracket notation and zero-based indexing
C. Using curly braces
D. Using parentheses

Question 11: What is the correct syntax for a JSON array containing numbers?

A. [“one”, “two”, “three”]
B. [1, 2, 3]
C. {1, 2, 3}
D. (“one”, “two”, “three”)

Question 12: What type of data can be stored in a JSON value?

A. Only strings
B. Strings, numbers, objects, arrays, booleans, or null
C. Only numbers
D. Only objects

Question 13: How do you convert a JSON string to a JavaScript object?

A. parseJSON()
B. stringifyJSON()
C. JSON.parse()
D. JSON.stringify()

Question 14: What does the JSON.stringify() method do?

A. Converts a JSON string to a JavaScript object
B. Converts a JavaScript object to a JSON string
C. Converts a string to a number
D. Converts a number to a string

Question 15: Why is JSON commonly used in web development?

A. To create complex layouts in HTML
B. To define CSS styles
C. To exchange data between a server and a web page
D. To execute server-side code in the browser
Answers:
1-A, 2. B, 3. C, 4. B, 5. C, 6. C, 7. C, 8. A, 9. D, 10. B, 11. B, 12. B, 13. C, 14. B, 15. C

دارت | فلاتر

Curriculum

JavaScript JSON:What is JSON?