Found 8894 Articles for Front End Technology

How to use array that include and check an object against a property of an object?

Shubham Vora
Updated on 16-Feb-2023 15:27:55

4K+ Views

The task is to check whether the array contains a particular value. Also, we need to check if the array contains the particular object with the given property. This tutorial will use the array.includes(), and array.some() method to check whether the array contains the value or object with a particular property. Use the array.includes() method to check values exist in the array The array.includes() method allows us to check whether the array contains any value. In simple terms, we can search for values in the array using the array.includes() method. Syntax Users can follow the syntax below to use the ... Read More

How to swap two variables in JavaScript?

Shubham Vora
Updated on 16-Feb-2023 15:26:54

2K+ Views

We will learn to swap two variable values in JavaScript using various approaches. Let’s understand via example what swapping means. For example, we have two variables called variable1 and variable2. When we assign the values of variable2 to variable1 and the value of variable1 to variable2, we can say that we have swapped the values of variable1 and variable2. Use the temporary variable We can create a temporary variable, which means any variable to store the value of the first variable temporarily. After that, we can assign the value of the second variable to the first variable. Next, we can ... Read More

How to stop forEach() method in JavaScript?

Shubham Vora
Updated on 12-Sep-2023 01:16:52

43K+ Views

In JavaScript, Programmers can use the forEach() method to iterate through the array of elements. We can call a callback function, which we can pass as a parameter of the forEach() method for every array element. Sometimes, we may require to stop the forEach() loop after executing the callback function for some elements. We can use the ‘break’ keyword with a normal loop to stop it, as shown below. for(let i = 0; i < length; i++){ // code if( some condition ){ break; } ... Read More

How to sort option elements alphabetically using jQuery?

Shubham Vora
Updated on 16-Feb-2023 15:24:17

6K+ Views

Sometimes, we require sorting the options of the dropdown menu in alphabetical order. For example, you are selling computers on your website, and you want to allow users to select a computer based on the model. If your website contains hundreds of models of different brands, it will be hard for users to find a computer with a particular brand if it is not sorted. However, you can provide the search functionality but if it’s not there, then sorting all the option elements in alphabetical order is better. Here, we will learn various approaches to sort all options of the ... Read More

How to Create Query Parameters in JavaScript?

Shubham Vora
Updated on 16-Feb-2023 15:20:39

2K+ Views

Now, the question is why we need to create a query parameter using JavaScript. Let’s understand it via real-life examples. For example, if you go on amazon’s website and search for any product, you will see that it automatically appends your search query to the URL. It means we require to generate the query params from the search query. Also, we can allow users to select any value from the dropdown option. We can generate query parameters and redirect users to a new URL based on the selected value to get results. We will learn to create a query parameter ... Read More

How to create a hash from a string in JavaScript?

Shubham Vora
Updated on 16-Feb-2023 15:19:18

7K+ Views

Before we start, let’s understand the hash in JavaScript. The hash is also a string, but it's encrypted using a particular algorithm. Generally, we use the hash for security purposes. For example, Google stores users' emails and passwords in their database. Now, Google’s employees can access their database for development purposes. But can they get the user’s email and password from the database? No, because the password is stored in the hash form, and to decrypt the password, the employee needs the key which we used while creating the hash from the password string. So, in such a way, we ... Read More

How to create a dynamic length array with numbers and sum the numbers using JavaScript?

Shubham Vora
Updated on 16-Feb-2023 15:18:02

861 Views

In JavaScript, arrays are always dynamic in length. Like other programming languages, we don’t need to define the array's length while creating the array. So, we can create an array and push whatever number of elements we want in the JavaScript array. Here, we will create the dynamic length of the array and add numbers to that. After that, we will sum up all numbers. This tutorial will teach us to create a dynamic length array with numbers and sum the numbers using JavaScript. Use the for loop to sum all elements of the dynamic array We can iterate over ... Read More

How to create a dropdown list using JavaScript?

Shubham Vora
Updated on 16-Feb-2023 15:16:43

12K+ Views

We will learn to create a dropdown list using HTML and JavaScript below. Before starting with the article, let’s understand the dropdown list and why we need to use it. The dropdown list gives multiple choices to users and allows them to select one value from all options. However, we can do the same thing using multiple radio buttons, but what if we have hundreds of choices? Then we can use the dropdown menu. When users click the dropdown button, it opens all the choices, and users can select anyone. Also, the dropdown provides a better user experience than the ... Read More

How to create Dialog Box in ReactJS?

Shubham Vora
Updated on 16-Feb-2023 15:14:41

12K+ Views

The dialog box is a popup box like a modal in ReactJS. In vanilla JavaScript, maybe you have used the alert() method, which allows us to show an alert message in the alert box. Also, vanilla JavaScript provides the confirm box and prompt box to take user input. The dialog box also allows us to perform all operations. We can add the normal HTML to the dialog box according to our requirements, and it works as a popup box. In this tutorial, we will use the various libraries to create a dialog box. Use the Material-Ui library The Material-Ui library ... Read More

How to create Date Picker in ReactJS?

Shubham Vora
Updated on 16-Feb-2023 15:13:42

8K+ Views

The date picker allows users of the application to pick a date. If we take data in the string format from the users, they can make a mistake while entering the date and enter the wrong format of the date. So, the best way to take a correct date input from the users is using the date picker. In this tutorial, we will use various libraries of ReactJS and create a date picker allowing users to pick any date, month, year, or decade. Use the ‘react-date-picker’ NPM package The react provides various libraries and npm packages to manipulate the date ... Read More

Advertisements