Access the First Value of an Object Using JavaScript

AmitDiwan
Updated on 16-Feb-2023 15:12:13

11K+ Views

In this article, you will understand how to access the first value of an object using JavaScript. The first value of the object is the first property located at position[0] of the object. The object can be a key-value object or an array object. Example 1 In this example, let's consider a key-value pair object. const inputObject = {1: 'JavaScript', 2: 'Python', 3: 'HTML'}; console.log("A key-value pair object is defined and its values are: ", inputObject) console.log("The first value of the object is: ") const firstValue = Object.values(inputObject)[0]; console.log(firstValue); Explanation Step 1 − Define a key-value pair ... Read More

Compare Two Objects for Equivalent Property Values in JavaScript

Shubham Vora
Updated on 16-Feb-2023 15:10:32

1K+ Views

In JavaScript, the object contains various properties and methods. For every property, it contains a value. We need to compare the values of the property also to make the comparison between two objects. Here, we will learn to check if the first object contains all properties that the second object contains and compare the values for every property. Compare the object property values one by one The easiest way is to check for every property of the second object that the first object contains or not. If the first object contains that property, compare the values of both. It means ... Read More

Access Object with Spaces in Key Using JavaScript

AmitDiwan
Updated on 16-Feb-2023 15:10:06

1K+ Views

In this article, you will understand how to access an object having spaces in the object’s key using JavaScript. In such cases, we use bracket notation ‘[]’ to access objects or we use dot notation(.) to access objects. Let’s see a few examples below. Example 1 In this example, let's use the bracket notation[] to access objects. console.log("The input object is a key value pair with key as firstName and value as Joseph"); const inputObject = {'firstName': 'Joseph'}; console.log("Using bracket notation to access value") console.log(inputObject['firstName']); console.log("Using bracket notation to change the value to Alice") inputObject['firstName'] = 'Alice'; ... Read More

How Optional Chaining Works in TypeScript

AmitDiwan
Updated on 16-Feb-2023 15:08:00

404 Views

In this article, you will understand how optional chaining works in TypeScript. Optional chaining operator (?.) accesses an object’s property. If the objects property is null or not defined, it returns ‘undefined’. Let us first understand what TypeScript is. Strongly typed programming language TypeScript, which is based on JavaScript, gives you better tools at any scale. Code written in TypeScript can be converted to execute in any JavaScript-compatible environment. JavaScript is understood by TypeScript, and type inference is used to provide excellent tooling without the need for additional code. Example 1 In this example, we use the optional chaining operator ... Read More

Create Dark/Light Mode for a Website Using JavaScript & jQuery

Shubham Vora
Updated on 16-Feb-2023 15:07:34

8K+ Views

Dark mode is very important for any website. Users with different interests visit the websites. Some of them like dark mode, and some like light mode. According to one survey, around 70 to 80% of people like dark mode, and only 20 to 30% like light mode. So, it is necessary to create a dark mode for any website, allowing users to toggle between the dark and light modes. Below, we will create a simple webpage using HTML, CSS, and JavaScript. Also, we will learn to implement the light and dark modes using JavaScript and CSS. Syntax Users can follow ... Read More

Create Dark Mode in ReactJS Using Material-UI

Shubham Vora
Updated on 16-Feb-2023 15:05:48

2K+ Views

Using the Material UI library, we will learn to create a Dark Mode in ReactJS. The Material UI is the external react library that provides the designed react components that we can directly use in our react project by importing from the library. In the world, most users like dark mode, and only some love light mode. The dark mode helps us decrease visitors' eye strain and look more luxurious. So, we should allow users to choose the either dark or light mode according to their preference. In vanilla JavaScript or JQuery, we can create dark and light modes by ... Read More

Count Numbers Less Than or Equal to Given Value Using Percentile in JavaScript

AmitDiwan
Updated on 16-Feb-2023 15:04:53

164 Views

In this article, you will understand how many numbers in the given array are less/equal to the given value using the percentile formula. We calculate the percentage of numbers in the given array less or equal to the number using the formula − Percentile = (n/N) * 100 Where, n is the number of values below x and N is the total number of values. Example 1 In this example, we use a for-loop to iterate the array and check each element whether the value is less, equal or greater than the given input value. const calculationPercentile = ... Read More

How ES6 (ES2015) Evolved and Brought New Features to Modern Day JavaScript

AmitDiwan
Updated on 16-Feb-2023 14:59:50

175 Views

In this article, you will understand how ES6 (ES2015) evolved and brought new features to modern day JavaScript. ES6 stands for ECMAScript 6. It is the 6th version of ECMAScript and was created to standardize the JavaScript. The top 10 features of ES6 are: let and const keywords, Arrow Functions, Multi-line Strings, Default Parameters, Template Literals, Destructuring Assignment, Enhanced Object Literals, Promises. Example 1 In this example, let’s demonstrate the Arrow function(=>) − console.log("An Arrow function Square has been defined") square = (x) => { return x * x; } let inputValue = 6 console.log("The input ... Read More

Create a Chart Using Bootstrap

Shubham Vora
Updated on 16-Feb-2023 14:57:45

3K+ Views

The chart is very important to visualize the data, and we can show the data in various formats and analyze the pattern in the data. Also, the chart is more important for data scientists as they need to analyze the various data. Bootstrap is a library that allows us to draw various charts using JavaScript or JQuery. It contains the functions that we need to import and pass chart type and chart data as an argument of the function, and it will prepare a chart for us. This tutorial will teach us to draw various chart patterns using Bootstrap. Syntax ... Read More

Difference Between Promise.any() and Promise.race() in JavaScript

AmitDiwan
Updated on 16-Feb-2023 13:52:21

124 Views

In this article, you will understand how Promise.any() method differs from Promise.race() method in JavaScript. The Promise.any() method in javascript is one among promise concurrency methods. It is useful when the first task needs to be completed. The Promise.race() method in javascript is one among promise concurrency methods. It is useful when the first async task need to be complete, but do not care about its eventual state (i.e. it can either succeed or fail). Example 1 In this example, let’s look at how the Promise.any() method works console.log("Defining three promise values: promise1, promise2 and promise3"); const promise1 = ... Read More

Advertisements