Checking If CSS Property Supported in Current Browser with Javascript
With newer CSS properties not available in all browsers, it is sometimes required to check whether a CSS property & its value are supported in the current browser. This can be detected in Javascript using the CSS.supports() method.
Get Random Numbers, Cryptographically Secure, in Javascript
Random numbers that are cryptographically strong, can be generated in Javascript using the Web Crypto API.
Using formdata Event for AJAX Form Submissions
The newly introduced formdata event can enable the Javscript FormData object to participate in form submissions. When trying to submit a form via AJAX, this is helpful to include custom elements in the request.
Dynamically Rotating an Image using Javascript
An image can be rotated with Javascript by dynamically changing its CSS transform property. The point around which rotation needs to happen can be specified with the transform-origin property.
Managing the URL Hash with Javascript
The Javascript URL object can be used to get and set hash value of a given url. To detect a change in hash in the current url, the hashchange event can be listened to.
Reading a File and Getting its Binary Data in Javascript
The binary data of a local file selected by the user can be retrieved using the readAsBinaryString method of a FileReader object.
How to Check if Cookies are Enabled or Disabled
Without cookies being enabled in the browser, some web applications may not work as expected. To prevent such cases navigator.cookieEnabled property can be used to do a prior check whether cookies are enabled or not.
Checking for a Secure Context Before Running User Sensitive Code
Browsers allow user-sensitive and low-level web APIs to execute only when the page is in a secure context. In addition, the window.isSecureContext property can be used to check whether the current environment is safe or not.
Filling an Array with a Given Value in Javascript
The Array.fill() method can be used to fill an array with a specific value, starting from a given index and ending upto another index.
Flatten Array Containing Arrays in JavaScript
Flattening an array refers to the process taking an input array, which may itself contain n-dimensional arrays as its elements, to a single array. This can be done in Javascript using the flat() method.
Format Number as Currency in Javascript
The Intl.NumberFormat object can be used to format a number as a currency using Javascript. Various options can be set to customize format of currency code, comma / decimal separators etc.
Knowing whether Promise is Completed (either Fulfilled or Rejected) with finally() Callback
The finally() callback can be used to know whether the Promise was settled. We don't care whether it was resolved or rejected.
Setting Default Values to Variables if null or undefined (using Nullish Coalescing Operator)
The nullish coalescing operator has been newly introduced in Javascript. This can be used to give default values if a variable is either null or undefined.
What Happens to setTimeout() / setInterval() Timers Running on Inactive Browser Tabs ?
Time delay for setTimeout() / setInterval() methods executing on inactive browser tabs are set to one second regardless of their value defined in code.
How to Disable Page Scrolling when Modal Dialog is Opened
When a fixed-position modal dialog is opened, scrollbars on the page can be removed by dynamically setting overflow:hidden CSS for the 〈body〉tag.
Preventing Addition of New Properties to a Javascript Object with Object.seal()
The Object.seal() method seals an object. After an object gets sealed, no new properties can be added to it.
Preventing Changes to a Javascript Object with Object.freeze()
The Object.freeze() method can make an object or array immutable. No changes can be made to that object once it gets immutable.
Hashbang Comments - The Third Way of Adding Comments in Javascript Code
Hashbang comments is the third type of syntax for adding comments to Javascript code. This comment can specify the Javascript interpreter that is to be used to execute the code within a script file or a module.
Loading CSS Stylesheet on Demand Through Its disabled Attribute
A stylesheet can include the disabled attribute in its markup to prevent it from being downloaded on page load. Later when the stylesheet needs to loaded on demand, its disabled attribute can be removed with Javascript.
Numeric Separators in Javascript to Improve Readability of Large Numbers
Numeric separators can be used to improve readability of large numbers. For example the number 111111111111111111111111, which is difficult to read, can be alternately written as 111_111_111_111_111_111_111_111