JavaScript

Handling Props in Child and Parent Component Whenever we define a parent and a child component in React using Typescript, we must always define an Interface in the child component which defines what props child expects to recieve. By adding an interface to the child component, we are adding two big checks: In Parent Component: Are we providing the correct props to Child when we add it ti Parent? In Child Component: Are we using the correctly named + typed props in Child?...

The Javascript Array.every() method tests whether all the elements of an array satisfy the given condition (a callback passed in by the user). In essence, the every() method executes the callback function for each element of the array and returns true if all elements return true or false if only one element returns false. const isBelowThreshold = (currentValue) => currentValue < 40; const array1 = [1, 30, 39, 29, 10, 13]; console....

Computed Property Names is an ES6 feature which allows the names of object properties in JavaScript object literal notation to be determined dynamically, i.e. computed. JavaScript objects are really dictionaries, so it was always possible to dynamically create a string and use it as a key with the syntax object[‘property’] = value. However, ES6 Computed Property Names allow us to use dynamically generated names within object literals. Example: const myPropertyName = 'c' const myObject = { a: 5, b: 10, [myPropertyName]: 15 } console....

A typical switch statement in javascript looks like this example below: var type = 'coke'; var drink; switch(type) { case 'coke': drink = 'Coke'; break; case 'pepsi': drink = 'Pepsi'; break; default: drink = 'Unknown drink!'; } console.log(drink); // 'Coke' It’s similar to if and else statements below: function getDrink (type) { if (type === 'coke') { type = 'Coke'; } else if (type === 'pepsi') { type = 'Pepsi'; } else if (type === 'mountain dew') { type = 'Mountain Dew'; } else if (type === 'lemonade') { type = 'Lemonade'; } else if (type === 'fanta') { type = 'Fanta'; } else { // acts as our "default" type = 'Unknown drink!...

Officially, Nested Routing is the general idea of coupling segments of the URL to component hierarchy and data. In my own words, a nested route is a region within a page layout that reacts to route changes. For example, in a single-page application, when navigating from one URL to another, you do not need to render the entire page, but only those regions within the page that are dependent on that URL change....