When working with arrays of objects in JavaScript, you often need to remove duplicate entries based on a specific property. This tutorial shows different methods to accomplish this task. The Problem Consider an array of objects with duplicate names: const arr = [ {name: "Jack", age: "14"}, {name: "bob", age: "14"}, {name: "sue", age: "21"}, {name: "Jill", age: "16"}, {name: "Jack", age: "21"} ]; console.log("Original array:"); console.log(arr); Original array: [ ... Read More
The onunload event triggers when a user navigates away from a page, closes the browser tab, or refreshes the page. This event is useful for cleanup tasks like saving user data or showing farewell messages. Syntax // HTML attribute // JavaScript event listener window.addEventListener('unload', function(event) { // Cleanup code }); Example: Using onunload with HTML Attribute Close the page and see what happens! This event may give unexpected results ... Read More
The fontSizeAdjust property preserves text readability when font fallback occurs by maintaining consistent apparent size across different fonts. It adjusts the font size based on the aspect ratio (x-height to font-size ratio) to ensure uniform visual appearance. How fontSizeAdjust Works Different fonts have varying x-heights even at the same font-size. When a preferred font fails to load and falls back to another font, the text may appear too large or too small. The fontSizeAdjust property solves this by scaling the fallback font to match the aspect ratio of the preferred font. Syntax element.style.fontSizeAdjust = "value"; ... Read More
When working with file blobs in JavaScript, different browsers may support different implementations of createObjectURL(). Modern browsers use window.URL.createObjectURL(), while older WebKit browsers used window.webkitURL.createObjectURL(). Browser Compatibility Issue The webkitURL prefix was used in older versions of Chrome and Safari, while modern browsers have standardized on URL.createObjectURL(). Creating a Cross-Browser Wrapper Function To handle both cases, create a wrapper function that checks for browser support: function createObjectURL(file) { if (window.URL && window.URL.createObjectURL) { return window.URL.createObjectURL(file); } else if (window.webkitURL) { ... Read More
In JavaScript, the clear() method removes all elements from a Set. For built-in Sets, you can use the native clear() method. For custom Set implementations, you reassign the container to an empty object. Using Built-in Set clear() Method const mySet = new Set(); mySet.add(1); mySet.add(2); mySet.add(5); console.log("Before clear:", mySet); mySet.clear(); console.log("After clear:", mySet); console.log("Size:", mySet.size); Before clear: Set(3) { 1, 2, 5 } After clear: Set(0) {} Size: 0 Custom Set Implementation For a custom Set class, the clear method reassigns the container to a new empty object: ... Read More
An array is a special object in JavaScript that stores multiple types of values, including integers, strings, and floats simultaneously. JSON (JavaScript Object Notation) is a lightweight data format used to represent structured data, commonly used for transmitting data between servers and web applications. In this article, we'll explore how to convert a JavaScript array into JSON format using the JSON.stringify() method. Understanding JSON.stringify() The JSON.stringify() method converts a JavaScript value or object into a JSON string. Since arrays are objects in JavaScript, we can pass an array as an argument to this method. Syntax ... Read More
The debugger statement in JavaScript is used to set a breakpoint in your code. When the JavaScript engine encounters this statement, it pauses execution and opens the browser's developer tools debugger (if available), allowing you to inspect variables, step through code, and debug issues. Syntax debugger; How It Works When the JavaScript engine hits a debugger statement: Execution pauses at that line Browser developer tools open automatically You can inspect the current scope, variables, and call stack If no debugger is available, the statement is ignored Example: Basic Debugging ... Read More
When both parent and child classes have methods with the same name, JavaScript provides several ways to invoke the parent's method from the child class or externally. Syntax To call a parent method when overridden by a child class: // From within child class super.methodName() // From outside using call() ParentClassName.prototype.methodName.call(childObject) Using super Keyword (Recommended) The super keyword is the modern way to call parent methods from within a child class: class Parent { constructor(value) { this.value = ... Read More
In JavaScript, you can create a Map from two separate arrays containing keys and values. This is useful when you have parallel arrays where each index corresponds to a key-value pair. Problem Setup Suppose we have two arrays: const keys = [0, 4, 2, 3, 1]; const values = ["first", "second", "third", "fourth", "fifth"]; We need to create a Map where each key from the first array maps to the corresponding value from the second array at the same index. Using a for Loop The most straightforward approach is to iterate through ... Read More
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Economics & Finance