Category: Javascript

  • How to Play Sounds in JavaScript

    How to Play Sounds in JavaScript

    If you want to add sound to your web page or application, you can use JavaScript to play audio files. In this article, we will cover the basics of playing audio with JavaScript, including how to control the audio and different ways to load audio files. Using the audio Element The easiest way to play…

  • JavaScript Round Down: How to Truncate Decimals in Your Code

    JavaScript Round Down: How to Truncate Decimals in Your Code

    JavaScript has a number of built-in methods for working with numbers, including the ability to round them. In this article, we’ll cover how to round down numbers in JavaScript, also known as truncating decimals. Truncating Decimals with Math.trunc() One way to round down a number in JavaScript is to use the Math.trunc() method. This method…

  • LIKE in JavaScript

    LIKE is commonly used in SQL for matching strings that contain certain substrings. For example, this code will match all users who’s name contains john: A similar thing can be done in JavaScript by using this contains function: The contains function will automatically cast the provided str to a string if it is not already…

  • JavaScript Button onclick Event

    The onclick attribute is an event attribute that is supported by all HTML elements. It specifies the script to run when the element is clicked. Here is an example of how to use the onclick attribute in an HTML button element: When the button is clicked, an alert message will be displayed saying “Button clicked!”.…

  • Clear Canvas in JavaScript (Example With Button)

    To clear a canvas element in JavaScript, you can use the clearRect method of the canvas’s 2D rendering context. This will clear the entire canvas by replacing all the pixels with transparent pixels. If you instead want to clear the canvas with a specific color, you could use fillRect: This draws a white rectangle over…

  • The Real Reason Why Empty Arrays Evaluate to True in JavaScript

    When an empty array ([]) is cast to a boolean in JavaScript it equals true because it is an object, and all objects are cast to true. This is due to the fact that object variables are merely references to the location of the object which is a truthy value. At first this might seem…

  • Try Without Catch In JavaScript (Updated for 2023)

    If you want to try some code and not handle the exception, it can seem annoying that you have to include a catch: ES2019 (released in 2019) allows us to simplify the above code a bit with optional catch binding in which the error variable does not need to be specified: Currently, this is the…

  • Best Way to Create a GUID/UUID in JavaScript

    It used to be required to use a package or create your own function to generate a UUID in JavaScript. But now the crypto.randomUUID() method can be used to generate a v4 UUID. This will work in Node.js and all major browsers. Here’s an example of how to use the crypto.randomUUID() method in JavaScript: Keep in mind that…

  • How to Wait 5 Seconds in JavaScript

    You can use the following function to call your JavaScript code after a delay of N seconds: To use this function, you can call it with a desired number of seconds, and then use the then() method of the returned promise to specify a callback function that will be executed when the promise resolves: Or,…

  • Double Exclamation Point (!!) in JavaScript (and Why Boolean() is Better)

    In JavaScript, the double exclamation mark (!!) converts any value to its corresponding boolean value. !! does this by first inverting the value using the logical NOT operator (a single exclamation mark), and then inverting it again using the second exclamation mark. For example, in this code, the double exclamation mark first inverts the value…

  • Best Way to Sort Array of Objects by Date in JavaScript

    In JavaScript, you can use the sort() method to sort an array of objects by date. The sort() method takes a compare function as an argument, which allows you to specify the sort order. Here is an example of using the sort() method to sort an array of objects by date: In this example, we…

  • Best Way to Check If Variable is a Function in JavaScript

    Best Way to Check If Variable is a Function in JavaScript

    To check if a variable is a function in JavaScript, you can use the typeof operator. Here’s an example: The typeof operator returns the type of a variable or expression. In this case, it will return ‘function’ if the variable is a function. Alternatively, you can use the isFunction() method from the underscore.js library, which…

  • How to Bold Text in JavaScript – Don’t Use String.bold()!

    If you are wondering how to bold text in JavaScript, you might have come across other articles telling you to use the String.prototype.bold() method. Don’t do this! There are two primary reasons: Here is a function you can use to bold text in JavaScript: Note that the string must then be inserted into the HTML…

  • Check If File Exists in Node.js

    To check if a file exists in Node.js, you can use the fs.existsSync() method from the fs module. This method takes the path to the file as its argument and returns a boolean indicating whether the file exists or not. Here is an example of how you can use the fs.existsSync() method to check if…

  • Best Way to Automatically Update Copyright Date with JavaScript

    The best way to automatically update the copyright date with JavaScript is to use the Date object to get the current year and then use the innerHTML property to insert the current year into the page. Here is an example: This code will insert the current year after the copyright symbol. This will automatically update…

  • How to Handle Big Numbers in JavaScript (Integers and Floating Point)

    Working with large numbers in JavaScript can be a challenge, but with the right tools and techniques, it can be done efficiently and effectively. In this article, we will explore some of the ways you can handle big numbers in JavaScript, including using the built-in BigInt data type and the popular bignumber.js library. Working With…

  • JavaScript Check If String

    To check if a variable is a string in JavaScript, you can use the typeof operator. This operator returns the data type of the operand, which you can then compare to the string “string”. Here is an example: In this example, the isString() function takes in a single argument val and uses the typeof operator…

  • How to Fix Empty window.speechSynthesis.getVoices()

    It takes a while for the window.speechSynthesis.getVoices() method to fully populate. If you call it during page load or even immediately after page load then it will likely return an empty array, []. There is a simple fix to this: Text-to-Speech Demo Below is our JavaScript text-to-speech demo that shows an example of using the…

  • JavaScript Text-to-Speech (TTS) in 2 Lines of Code

    Text-to-speech is the process of converting written text into spoken words. In JavaScript, this can be achieved using the SpeechSynthesis interface, which is part of the Web Speech API. This interface allows you to configure the voice and other properties of the speech, and then speak out a given string of text. Here is an…

  • JavaScript UUID Regex

    To match a UUID (also known as a universally unique identifier) using a regular expression in JavaScript, you can use the following regex pattern: And here is an example using this regex in JavaScript: isUUID Function To create a function that checks if the provided value is a UUID, we can wrap the code above…

  • JavaScript Hello World

    To create a “Hello, World!” program in JavaScript, you can use the following code: To run this code, you can either include it in an HTML file using a <script> tag and open the file in a web browser, or you can run it using a JavaScript runtime environment, such as Node.js. In a Browser…

  • Click Counter

    Click Me! Number of clicks: 0 Source Code Auto Clicker We created the click counter so that our users could easily test out our auto clicker. Make sure to check out that article if you are looking for an easy-to-use JavaScript auto clicker!

  • JavaScript Auto Clicker

    JavaScript Auto Clicker

    An “auto clicker” is a type of software or macro that automatically clicks a mouse button for the user. The easiest way to use a JavaScript auto clicker would be to use our bookmarklet that clicks for you when you click and hold your mouse. To use the bookmarklet: Or, if you prefer you can…

  • Find Max/Min Value of Array in JavaScript

    To find the maximum value in an array in JavaScript you can use Math.max along with the spread operator (…): In this code, the spread operator is used to spread the elements in the numbers array as individual arguments to the Math.max() method. This allows the Math.max() method to compare all the elements in the…

  • How to Remove First Element From Array in JavaScript

    To remove the first element from an array in JavaScript, you can use the shift() method. This method removes the first element from an array and returns that element, so you can store it in a variable if you need to use it later. For example, consider the following array: To remove the first element…

  • XML to JSON (and Back Again) in JavaScript

    To convert XML to JSON in JavaScript, you can use the xml2json library: In this code, the toJson() method from the xml2json library is used to convert the XML string to a JSON string. To convert the JSON string to a JSON object you can then use JSON.parse: Once you have the JSON object, you…

  • JavaScript Two Dimensional Array

    In JavaScript, a two-dimensional array is an array of arrays. It is an array that contains one or more arrays, and each of those arrays contains one or more elements. Here is an example of a two-dimensional array: In this example, matrix is a two-dimensional array that contains three arrays: [1, 2, 3], [4, 5,…

  • Change Background Color in JavaScript

    In JavaScript, you can change the background color of an element by setting its style.backgroundColor property. For example, if you have a div element with the id myDiv, you can change its background color like this: This will set the background color of the div to white. You can replace ‘#ffffff’ with any other valid…

  • Check if Element Has Class in JavaScript

    To check if an element has a specific class in JavaScript, you can use the classList property of the element and call the contains() method on it. This method takes the class name as a parameter and returns true if the element has the class, and false if it does not. Here is an example:…

  • Save File Locally in Browser with JavaScript

    To save a file locally in JavaScript, we recommend using the FileSaver library. To install the FileSaver library, you can use the npm package manager. Here is an example of how to do this: Once the library is installed, you can use it in your JavaScript code by importing it like this: Now, here is…

  • Node.js FS Delete File

    To delete a file using JavaScript, you can use the fs module in the Node.js environment. This module provides a way to work with the file system, including creating, reading, writing, and deleting files. To delete a file, you can use the fs.unlink() method, which takes the path to the file as an argument and…

  • How to use Display None in JavaScript

    In JavaScript, you can use the display property to control the visibility of an element on a page. If you want to hide an element, you can set its display property to none. Here is an example of how you might do this: In this code, we are using the getElementById method to select the…

  • Push to Front of Array in JavaScript

    To push to the front of an array in JavaScript, you can use the Array.prototype.unshift() method. This method adds one or more elements to the beginning of an array and returns the new length of the array. Here is an example: In this code, we first define an array called numbers that contains the numbers…

  • Check if Not in Array in JavaScript

    To check if an element is not included in an array in JavaScript, you can use the Array.prototype.includes() method along with the ! operator. This method returns a Boolean value indicating whether the specified element is found in the array. Here is an example: In this code, we first define an array called numbers that…

  • Wait For Promise in JavaScript

    To wait for a promise to resolve in JavaScript, you can use the await keyword inside an async function. For example: Alternatively, you can use the .then() method to handle the resolved value of the promise. For example: It’s important to note that await can only be used inside an async function, and the async…

  • JavaScript String to Array

    To turn a string into an array in JavaScript, you can use the split method. This method takes in a delimiter as an argument, and it splits the string into an array of substrings based on that delimiter. Here is an example: The split method is a very useful method for working with strings in…

  • JavaScript Wait for Element to Exist

    The MutationObserver class allows you to monitor the DOM for changes and run a callback function when a specified element is added to the DOM. This can be leveraged to wait for a specific element to exist: Example Usage In this example, the waitForElement() function is used to wait for the search input field to…

  • Cast to String in JavaScript

    In JavaScript, there are several different ways to cast a value to a string. However, the recommended way to do this is to use the String() method. This is a global function that can be used to convert any value to a string. It is a versatile method because it can be used with any…

  • JavaScript String() vs toString()

    In JavaScript, both String() and toString() are methods that can be used to convert values to strings. However, there are some key differences between the two that are worth noting. The String() method is a global function that can be used to convert any value to a string. It is a more versatile method because…

  • JavaScript Dynamic Property Name

    You can use the square bracket notation to create an object with dynamic keys in JavaScript. This notation allows you to specify the property name as a string within the square brackets, which makes it possible to create object properties with dynamic names. For example, the following code creates an object with two dynamic keys,…