Javascript: Explain JSON.stringify() in Javascript

 Q. Explain JSON.stringify() in Javascript

 

JSON.stringify() is a method in JavaScript that converts a JavaScript object or value into a JSON string. JSON stands for JavaScript Object Notation, and it's a lightweight data-interchange format that's easy for humans to read and write and easy for machines to parse and generate.

Here's how JSON.stringify() works:

1. If the input value is an object (including arrays, dates, and plain objects), JSON.stringify() will serialize it into a JSON string.
2. If the input value is not an object (like a string, number, boolean, or null), it will be coerced into its corresponding primitive value, and that value will be returned.
3. If the input value is undefined, a function, or a symbol, it will be excluded from the resulting JSON string (or replaced with null if it's a property value within an object).

Here's a simple example:

javascript
const obj = {
  
name: "John",
  
age: 30,
  
isAdmin: true,

  hobbies: ["reading", "coding", "hiking"],

  address: {
    city: "New York",
    zip: "10001"
  }

};


const jsonString = JSON.stringify(obj);

console.log(jsonString);

This will output:

Result
{"name":"John","age":30,"isAdmin":true,"hobbies":["reading","coding","hiking"],"address":{"city":"New York","zip":"10001"}}

You can also provide a "replacer" function or an array of property names to specify which properties should be included or how they should be transformed during serialization. Additionally, you can specify a "space" parameter to add whitespace for improved readability of the resulting JSON string.

javascript
const obj = {
  
name: "John",

  age: 30,

  isAdmin: true,
  
hobbies: ["reading", "coding", "hiking"],

  address: {
    city: "New York",
    zip: "10001"
  }

};


const jsonString = JSON.stringify(obj, ['name', 'hobbies'], 2);
console.log(jsonString);

This will output:

Result
{
  "name": "John",
  "hobbies": [
    "reading",
    "coding",
    "hiking"
  ]
}

This is particularly useful when you want to exclude certain properties or control the structure of the resulting JSON string.

Javascript: Explain fetch.. then .. catch in javascript.

fetch() is a modern API in JavaScript used to make network requests, typically to fetch resources from a server. It returns a Promise that resolves to the Response object representing the response to the request.

The basic syntax for fetch() is:

javascript
fetch(url)
  .then(response => {
    // handle response
  })
  .catch(error => {
    // handle error
  });

Here's what each part does:

• fetch(url): Initiates a fetch request to the specified URL. This can be an absolute URL or a relative URL. This method returns a Promise that resolves to the Response object representing the response to the request.

• .then(response => { ... }): This is a method of the Promise returned by fetch(). It takes a callback function that will be executed when the Promise is resolved (i.e., when the response is received). The response parameter contains the Response object representing the response to the request. Inside this callback, you handle the response, such as extracting data from it.

• .catch(error => { ... }): This is also a method of the Promise returned by fetch(). It takes a callback function that will be executed if the Promise is rejected (i.e., if an error occurs during the fetch request). The error parameter contains information about the error that occurred. Inside this callback, you handle the error, such as logging it or displaying an error message to the user.

Here's a simple example of using fetch() to make a GET request to a URL and handle the response:

javascript
fetch('https://api.example.com/data')
  
.then(response => {

    if (!response.ok) {

      throw new Error('Network response was not ok');
    
}
    
return response.json(); // Parse the JSON content of the response

  })
  
.then(data => {
    
console.log(data); // Do something with the parsed data

  })
  
.catch(error => {
    
console.error('Fetch error:', error); // Log any errors that occur during the fetch
  
});

In this example, fetch() makes a GET request to 'https://api.example.com/data'. If the response is successful (i.e., if the status code is in the range 200-299), we parse the JSON content of the response using response.json() in the first .then() block. If there's an error during the fetch (e.g., network error or CORS issue), it's caught in the .catch() block and logged to the console.