Posts

Showing posts from April, 2022

How to Reverse Array Order in JavaScript

Somettimes we need to reverse the order of an array. Here is an app for it. Just Type in the array in the textarea bellow. [1,2] Reverse JavaScript Code for Array Order Reversion Function function arrayOrderReverse(array){ var newArray = []; array.forEach(x=>{ newArray.unshift(x) }); return newArray; } Code Explained To reverse the order of an array, I use the upshift() array method, which add element in the first element of an array. Continue adding the last element in front of all others will reverse the order. Bulit-in Method JavaScript has the array.reverse() method that does the same thing. One thing to keep in mind is that this method will chage the original array.

The Use of Return in JavaScript

The basic use of return in JavaScript is to run some function and asiagn a result to a variable. For exampe, var number; function getSquare(x){ return x*x; }; number = getSquare(2); console.log(number); //4 Print the Result The use of return in combination with HTML can be shortern the code if you want to output it on the website. Get Square <input type = "number" value = "2" id = "numberInput"><br> <button onclick = "calculate()">Get Square</button> <div id = "show"></div> <script> function calculate(){ show.innerHTML = getSquare(numberInput.value); }; function getSquare(x){ return x*x; }; </script> Here the line of code we are interested in is "show.innerHTML = getSquare(numberInput.value);" where we don't need to assign to another variable. Use Return When Runing Multiple If Statement We can use the switch case loop to check if a variable has a certain v...

Run Statement As Condition In If Statement In JavaScript

The basic syntax for the if statement in JavaScript is this: if(true){ do something; }else{ do something; }; What else? One useful feature of the if statement in JavaScript is that we can also run othe statement and verify if the result is true then proceed the if statement. For example, if(x = true){ console.log("It is true."); }else{ console.log("It is false."); }; console.log(x); //It is true. //true One thing weird about the x? Note that the x in the above example is a global variable without being declared before used as the output in an if condition expression. Why is running some code in the if condition expression is useful? This is useful when I want to find out if somehitng exists in an array and want to do something with this particular item. For example, var arr = [1,2,3]; if(x = arr.find(y=>{return y == 1})){ console.log(x + ", which is in the array."); }else{ console.log(x + ", oops."); }; //1, which is in the a...

JavaScript Input Date Verification Functions

This is a simple tool that verifies if a date exists on input of a date. Here are 3 function we can use. A function that checks if an array of dates has the selected date. A function that checks if an object which has property date maching selected date. A function that checks if an array of arrays of data in which has date mached by selected date. This blog post is inspired by thet fact that there is no easy way to disable holidays and weekends of an input with the type date. This is annoying when you are building a webapp that takes users' input date and displays the result. When the users select a date that has no maching data. We have to display an error message and ask the users to reselect a date. How nice would it be if there existed a built in weekend/holiday verificcation for HTML date inputs!! A function that checks if an array of dates has the selected date Here, my array of dates do not include weekends of 4/16 or 4/17. Try to selece...

The Very Useful JavaScript Ternary Operators

The JavaScript ternary operators are used when a variable is determent based on certain conditions. The ternary operators are similer to the if statement in a way they both execute some code based on different condition. But unlike multiple lines of code can be executed when some conditions are met with the if statement, the ternary operators can only assign a variable a value when some coditions are stisfied. JavaScript Ternary Operators Syntax The JavaScript ternary operators look like this: var x = (conditions) ? value assign to x if some conditions are met : value assign to x if some conditions are not met; Chaining JavaScript Ternary Operators The JavaScript ternary operators can be chained when there are layers or steps of conditions that need to be checked. Chianing Example var age = 6; var gender = "male"; var whatAmI = age < 24 ? gender == "male " ? "boy" : "girl" : gender == "male " ? "man"...

The Mysterious Array.reduce() Method in JavaScript

The array.reduce() method is famous for summing up an array of numbers. var arr = [1,2,3]; var sum = arr.reduce((x,y)=>{ return x + y }); console.log(sum); //6 It can be also used go conduct a series of substraction starting from the first number. var arr = [100,50,10]; var remaining = arr.reduce((x,y)=>{ return x - y }); console.log(remaining); //40 Or, the array.reduce() method can be used to execute a series of multiplication or division. var arr1 = [1,2,3,4]; var fac = arr1.reduce((x,y)=>{ return x * y }); console.log(fac); //24 var arr2 = [100,5,4]; var fac = arr2.reduce((x,y)=>{ return x / y }); console.log(fac); //5 What Actually Happened Inside the Array.reduce() Method? What happs inside the arrray.reduce() method is that it keeps the return value as a parameter for the next itiration of the calculation until all elements of the array are gone through. And the initial return value or element, since no calculation has been executed, will be the first ...