Create URL Object Using JavaScript

AmitDiwan
Updated on 17-Jul-2020 08:12:47

506 Views

Following is the code to create a URL object using JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Url object in JavaScript CLICK HERE Click on the above button to create and display a url object    let resEle = document.querySelector(".result");    let url = new URL("https://google.com/image=23&size=440px");    document.querySelector(".Btn").addEventListener("click", () => {       resEle.innerHTML += "url protocol = " + url.protocol + "";       resEle.innerHTML += "url host = " + url.host + "";       resEle.innerHTML += "url.pathname = " + url.pathname + "";    }); OutputThe above code will produce the following output −On clicking the ‘CLICK HERE’ button −

File and FileReader in JavaScript

AmitDiwan
Updated on 17-Jul-2020 08:05:46

343 Views

Following is the code showing file and fileReader in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    }    .result {       color: red;    } File and FileReader in JavaScript Click on the above button to display file and its details    let resEle = document.querySelector(".result");    let sampleEle = document.querySelector(".sample");    function ... Read More

Convert Image to Blob Using JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:57:11

15K+ Views

Following is the code to convert an image to blob using JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Convert an Image to blob using JavaScript Convert Click on the above button to convert the above image to blob    let BtnEle = document.querySelector(".Btn");    let resEle = gdocument.querySelector(".result");    BtnEle.addEventListener("click", () => {     ... Read More

Access JavaScript Properties

AmitDiwan
Updated on 17-Jul-2020 07:54:32

273 Views

There are three ways to access JavaScript properties −Using dot property access: object.propertyUsing square brackets notation: object[‘property’]Using object destructuring: let {property} = objectFollowing is the code for accessing JavaScript object properties −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result,    .sample {       font-size: 18px;       font-weight: 500;       color: blueviolet;    }    .sample {       color: red;    } Access JavaScript object properties {a:22, b:44} Access Click on the ... Read More

TextDecoder and TextEncoder in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:52:24

588 Views

TextEncoder is used to convert a given string to utf-8 standard. It retunes an Uint8Array from the string.TextDecoder is used to covert a stream of bytes into a stream of code points. It can decode UTF-8 , ISO-8859-2, KOI8-R, GBK etc.Following is the code for TextDecoder and TextEncoder in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    }    .result {       ... Read More

Calculate Average of an Array in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:50:06

542 Views

Following is the code for calculating average of an array in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result,    .sample {       font-size: 18px;       font-weight: 500;       color: blueviolet;    }    .sample {       color: red;    } Calculating average of an array Check Click on the above button to see document state    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    let sampleEle = document.querySelector(".sample");    let arr = [1, 2, 3, 4, 5, 11, 22];    sampleEle.innerHTML = arr;    BtnEle.addEventListener("click", () => {       let sum = 0;       arr.forEach((item) => (sum += item));       resEle.innerHTML = "The average of the array = " + sum / arr.length;    }); OutputOn clicking the ‘Calculate’ button −

Re-throw Errors in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:48:06

218 Views

Exception can be rethrown after they have been caught by using the throw after catching the exception.Following is the code to re-throw errors in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Re-throw errors in JavaScript CHECK Enter a number bigger than 40 to re throw error;    let BtnEle = document.querySelector(".Btn");    let resEle = ... Read More

Destructuring and Function Parameters in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:47:22

200 Views

Following is the code to destructure function parameters in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .sample,    .result {       font-size: 18px;       font-weight: 500;       color: red;    }    .result {       color: rebeccapurple;    } De structuring function parameters CLICK HERE Click on the above button to call a function and pass above object to it as argument    let sampleEle = document.querySelector(".sample");   ... Read More

Check If a Document is Ready in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:45:07

721 Views

Following is the code to check if a document is ready in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: blueviolet;    } Check if a document is ready Check Click on the above button to see document state    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    resEle.innerHTML = document.readyState + "";    BtnEle.addEventListener("click", () => {       if (document.readyState === "complete") {          resEle.innerHTML = "The page has finished loading completely";       } else {          resEle.innerHTML = "The page is still loading";       }    }); OutputOn clicking the ‘Check’ button −

Generator throw Method in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:42:47

176 Views

The generator.throw() method is used to pass an error to the yield. The generator resumes the execution after throw has been called by throwing an error and returning object with properties done and value.Following is the code for generator.throw() in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    }    .result {       color: red;    } generator.throw() method ... Read More

Advertisements