Let’s say we need to present a number on a web page so that it is always a floating point number with two decimal places. This is for cases where absolute precision is not needed but we want to always present a number output in a uniform way. Here is an example of how to … Continue reading JavaScript: How to format a number to two decimal places
JavaScript Language
jQuery: How to create an animated alert box
Let’s say you’ve made a login form and you want to display a placard whenever the login information is incorrect to alert the user. For example, when the user types an incorrect email address or password, they see the placard above the form, with a white background and red text: This is easy enough to … Continue reading jQuery: How to create an animated alert box
React: A component render can return only one element!
A component render can return only one element, so if you want more complicated HTML output from your component’s render, it needs to be returned in a single div. In other words, every component can return only a single div. This applies to ReactDOM.render also. So if I want to render a Movie component three … Continue reading React: A component render can return only one element!
React: How to call a parent function from a child function and/or pass data to the parent function
In a continuation of the theme of how to pass information around in react, this article details how to call a parent function from a child function. This previous article details how to pass state from parent to child: React: How to pass state information from parent to child Allowing a child function to call … Continue reading React: How to call a parent function from a child function and/or pass data to the parent function
React: How to pass state information from parent to child
In a react script, to pass state information from a parent component to a child component, the state information needs to be passed as a prop. For example: numturns={this.state.number_of_turns} Now, “numturns” can be used as a prop in the child. For example, inside the child handleclick function: console.log(“Child communication, number of turns from parent: “, … Continue reading React: How to pass state information from parent to child
React: Using .bind(this) on parent and child components
In a react script, for every function in both the parent and child components we must have this magic line using .bind(this)in the constructors: this.nameOfFunction = this.nameOfFunction.bind(this); For example: // Parent with a incrementNumberTurns() function: this.incrementNumberTurns = this.incrementNumberTurns.bind(this); // Child with a handleClick() function: this.handleClick = this.handleClick.bind(this) Here is an example from the parent component … Continue reading React: Using .bind(this) on parent and child components
jQuery: How to scroll to a div
When you first land on a page, it is possible to have the page scroll down to some remote div further down the page, using a little bit of jQuery. For example, if the remote div is called “remoteDiv”, this jQuery will automatically scroll down to the div when the page loads: $(“.remoteDiv”).ready(function() { $(‘html,body’).animate({ … Continue reading jQuery: How to scroll to a div
JavaScript: How to get N largest numbers in an array using sort( ) and slice( )
Where this previous article explained how to get the max number in an numeric array: JavaScript: How to get the largest number in an array using Math.max( ) There are times where we want more than just the single highest value in an array. What if we want the top 2, 3 or 5 numbers … Continue reading JavaScript: How to get N largest numbers in an array using sort( ) and slice( )
JavaScript: How to get the largest number in an array using Math.max( )
If we want the largest one number in an array, we can get that using JavaScript’s Math.max() function. Simply place the array of values (without square brackets) into the parenthesis of the function. Like so: console.log(Math.max(1, -5, 2, 8, 17, 0, -2)); Which yields: 17 A list of all negative numbers: console.log(Math.max(-11, -8, -2)); Which … Continue reading JavaScript: How to get the largest number in an array using Math.max( )
JavaScript: How to get a random index from an array
Let’s say I have an array of 100 integers that looks like this: let hundred = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, … Continue reading JavaScript: How to get a random index from an array