Articles on Trending Technologies

Technical articles with clear explanations and examples

How to create editable div using JavaScript?

Manisha Patil
Manisha Patil
Updated on 15-Mar-2026 2K+ Views

In this tutorial, you'll learn how to create editable div elements using JavaScript. An editable div allows users to click and modify text content directly in the browser, providing an intuitive inline editing experience. Method 1: Using contentEditable Property The simplest approach is using the HTML5 contentEditable attribute, which makes any element editable when set to true. Editable Div with contentEditable .editable-div { border: ...

Read More

How to calculate the XOR of array elements using JavaScript?

AmitDiwan
AmitDiwan
Updated on 15-Mar-2026 3K+ Views

We will use a for loop to iterate through the array. We will initialize a variable called "result" with the value of the first element in the array. For each subsequent element in the array, we will use the XOR operator to update the value of "result" with that element. This process will continue until all elements in the array have been processed, resulting in the final XOR value of all elements in the array. Let us first understand what XOR is. We will also see how XOR operation on an array works. Understanding Array XOR ...

Read More

JavaScript Count the number of unique elements in an array of objects by an object property

AmitDiwan
AmitDiwan
Updated on 15-Mar-2026 2K+ Views

In JavaScript, when dealing with arrays of objects, it's common to need to extract specific values based on object properties and count how many unique occurrences exist for a particular property. Whether you're processing a list of users, products, or any other data structure, counting unique elements by a property is a useful operation. In this article, we'll discuss how to count the number of unique elements in an array of objects based on a specific property using a few different techniques. Problem Statement You have an array of objects representing users, each with properties like name, ...

Read More

Sorting numbers in ascending order and strings in alphabetical order in an array in JavaScript

Aayush Mohan Sinha
Aayush Mohan Sinha
Updated on 15-Mar-2026 2K+ Views

In JavaScript, sorting arrays that contain both numbers and strings requires a custom approach since the default sort() method converts all elements to strings. This article explores two effective methods to sort mixed arrays with numbers first (ascending) followed by strings (alphabetical). Problem Statement We need to create a JavaScript function that sorts an array containing both numbers and strings. The requirements are: Numbers should appear before strings Numbers should be sorted in ascending order Strings should be sorted alphabetically Sample Input: ["zebra", 21, "apple", 5, "orange", 13, "banana", 2] Sample ...

Read More

How to set the angle of rotation of a Circle using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 15-Mar-2026 424 Views

In this tutorial, we are going to set the angle of rotation of a Circle using FabricJS. Circle is one of the various shapes provided by FabricJS. In order to create a circle, we have to create an instance of fabric.Circle class and add it to the canvas. The angle property in FabricJS defines the angle of 2D rotation of an object. We also have the centeredRotation property that allows us to use the center point of a circle as the origin of transformation. Syntax new fabric.Circle({ angle: Number, centeredRotation: Boolean }: Object) Parameters ...

Read More

How to lock the vertical skewing of Rectangle using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 15-Mar-2026 205 Views

In this tutorial, we are going to learn how to lock the vertical skewing of a Rectangle using FabricJS. Just as we can specify the position, colour, opacity and dimension of a rectangle object in the canvas, we can also specify whether we want to stop skewing an object vertically. This can be done by using the lockSkewingY property. Syntax new fabric.Rect({ lockSkewingY : Boolean }: Object) Parameters Options (optional) − This parameter is an Object which provides additional customizations to our rectangle. Using this parameter, properties such as colour, cursor, stroke ...

Read More

How to remove current object shadow in the URL string of IText object using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 15-Mar-2026 289 Views

In this tutorial, we are going to learn about how to remove current object shadow in the URL string of IText object using FabricJS. The IText class was introduced in FabricJS version 1.4, extends fabric.Text and is used to create IText instances. An IText instance gives us the freedom to select, cut, paste or add new text without additional configurations. There are also various supported key combinations and mouse/touch combinations which make text interactive which are not provided in Text. Textbox, however, which is based on IText allows us to resize the text rectangle and wraps lines automatically. This ...

Read More

How to call a function repeatedly every 5 seconds in JavaScript?

AmitDiwan
AmitDiwan
Updated on 15-Mar-2026 31K+ Views

In JavaScript, setInterval() allows you to execute a function repeatedly at specified time intervals. To call a function every 5 seconds, you pass the function and 5000 milliseconds as arguments. Syntax setInterval(function, delay); Where function is the function to execute and delay is the time in milliseconds between executions. Basic Example function myFunction() { console.log("Function called at:", new Date().toLocaleTimeString()); } // Call myFunction every 5 seconds (5000 milliseconds) setInterval(myFunction, 5000); Function called at: 2:30:15 PM Function called at: 2:30:20 PM Function called at: 2:30:25 ...

Read More

Pushing positives and negatives to separate arrays in JavaScript

AmitDiwan
AmitDiwan
Updated on 15-Mar-2026 462 Views

We are required to write a function that takes in an array and returns an object with two arrays positive and negative. They both should be containing all positive and negative items respectively from the array. We will be using the Array.prototype.reduce() method to pick desired elements and put them into an object of two arrays. Using Array.reduce() Method The code for this will be − const arr = [97, -108, 13, -12, 133, -887, 32, -15, 33, -77]; const splitArray = (arr) => { return arr.reduce((acc, val) => { ...

Read More

Grade book challenge JavaScript

AmitDiwan
AmitDiwan
Updated on 15-Mar-2026 372 Views

We are required to write a function that finds the mean of the three scores passed to it and returns the letter value associated with that grade according to the following table. Grade Scale Score Range Grade 90-100 A 80-89 B ...

Read More
Showing 15271–15280 of 61,297 articles
Advertisements