Six ways to create an Array in JavaScript.

Learn Different ways to create JavaScript Arrays. Image by Clem Onojeghuo 1 . Using assignment operator var array = []; var array2 = [1,2,3,4,5]; 2. Using new operator new Array(length) ; Creates an array with length set to the number. length > 0 otherwise it will throw error var arr = new Array(2); arr; [empty Ă— 2] arr.length; …

Detecting the End of CSS Transition Events in JavaScript

An overview of proper chaining Image by Hello I’m Nik 🇬🇧 Before CSS transition and animation (keyframes), to animate, we needed to code in JavaScript. But once these two properties were introduced, we can achieve complex animations with only CSS. In JavaScript, we can call the callback function once the animation is done. But in CSS, there …

Add Styles and Formatting to Your console.log Messages in JavaScript

Learn how to add CSS and formatting log messages in JavaScript. Image by Joanna Kosinska We all know the console.log function will log a simple message to the console. But console.log can also format the text and make the message stand out from other messages. This gives us the ability to find our important messages in …

Understand the Three Different Value Equality Comparison Algorithm in JavaScript.

Learn about different types of equality checking in JavaScript. Image from Coffee Geek. In JavaScript, there are three different value-comparison operations Abstract Equality Comparison(loose equality || == || double equals). Strict Equality(triple equals || === ). Same Value Equality ( Object.is() ). Introduced in ES2015 . Abstract Equality Comparison (==). a == b; Double Equals compares whether …

Detecting Focus of a Browser Tab in JavaScript

Determine if a tab has received focus from the user and how to handle events if the focus changes Image by Sincerely Media The Page Visibility API gives us the power to determine when a page has focus. The API also triggers visibilitychange event when the focus of the page changes. The Page Visibility API is …

Different ways to remove elements from an array in JavaScript

Image by Michael Dziedzic From UnSplash 1. Using the pop method Array.pop will delete the last element of an array. var array = [1,2,3,4,5]; array.pop(); array; // [1,2,3,4] array.pop(); array; // [1,2,3] 2. Using the shift method Array.shift will delete the first element of an array. var array = [1,2,3,4,5]; array.shift(); array; // [2,3,4,5] array.shift(); array; // [3,4,5] …

Using the every() and some() methods of Array in JavaScript

Learn how to use every and some method in JavaScript. every → Checks if all elements of the array satisfies the provided callback function some → Checks if any one of element in the array satisfies the provided callback function every The every method will take a testing function as an argument, all the element …

Removing jQuery From Your Project With JavaScript: Part 1

Learn to replace the jQuery DOM operation with JavaScript Photo by Sagar Patil on Unsplash The reasons for removing jQuery are: To get native performance To understand what’s happening inside jQuery functions so we can decide whether we go for jQuery or JavaScript Part 1 of this series only focuses on getting elements without using jQuery. …

Implementing Set functionality in JavaScript

Learn how to implement union ,intersection , difference , symmetricDifference in JavaScript. Image from Javier Quesada The Set object lets you store unique values of any type, whether primitive values or object references. Example var array = [1,2,3,4,4,5]; var set = new Set(array); set; // Set(5) {1, 2, 3, 4, 5} duplicates are removed The detailed introduction to Set …

Creating Dice in Flexbox in CSS

Learn how to create dice in CSS using flexbox Dice created with flexbox in CSS First Face First face of the div Our first-face of the die will have one dot at the center. <div class=”dice first-face”> <span class=”dot”> </span> </div> Here, we have the dice– and dot-classed elements. Now we can add some CSS to the die. …

Design a site like this with WordPress.com
Get started