An place to share JavaScript tips tricks and snippets. The goal is to build this out so it can be a quick reference with reusable easy to understand examples.

• isRequired - Form field validation class that verifies if a field is populated and if it is required and populated based on another field value (optional)
• Performance analysis - Using console.time and console.timeEnd we can check or compare the performance of an operation.

A snippet to get the day of the year from a Date object.

const dayOfYear = date =>
  Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);

// Examples:
dayOfYear(new Date("1776-07-04"));  // 185
dayOfYear(new Date("2019-12-25"));  // 358

The double tilde can be used as a quick way to truncate a value to an integer. It's nice because it never returns NaN. If it fails, it just returns 0.

console.log( ~~15.02 );    // returns 15
console.log( ~~"45.81" );  // returns 45
console.log( ~~-5.8 );     // returns -5
console.log( ~~"car" );    // returns 0
console.log( ~~[] );       // returns 0
console.log( ~~null );     // returns 0

The .every() method can be used to run a function or test on every element in the array

// syntax
array.every(callback)

// Examples:
// Test the every element in the array is greater than or equal to 5
[72, 5, 8, 30, 44].every(e => e >= 5); // returns true
[72, 5, 8, 3, 44].every(e => e >= 5); // returns false

// Same test using external callback function
function isGTEfive(element) {
  return element >= 5;
}
[72, 5, 8, 30, 44].every(isGTEfive); // returns true
[72, 5, 8, 3, 44].every(isGTEfive); // returns false

// Given an array of objects named critters
const critters = [
  {id: 1, critter: 'dog', age: 1},
  {id: 2, critter: 'dog', age: 2},
  {id: 3, critter: 'cat', age: 2},
  {id: 4, critter: 'bird', age: 1}
];

// Return the first object to contain age = 2
critters.find( obj => obj.age === 2); // returns {id: 2, critter: 'dog', age: 2}

// Return the first object to contain age = 2 where the array index > 1
critters.find( (obj, idx) => obj.age === 2 && idx > 1); // returns {id: 3, critter: "cat", age: 2}

A snippet to return the length of a string in bytes.

js const stringSize = str => new Blob([str]).size;

// Examples:
stringSize('Good Day');  // 8
stringSize('👀');        // 4

To set a variable to one thing if it is defined, but a default value if it is not.

// using or logic
var goodDay = sunShine || not

// without or logic (old way)
var goodDay = not;
if (sunShine) {
  var goodDay = sunShine;
}

Single line if expression

// syntax
condition ? expr1 : expr2

// example
"Total price is " + (isMember ? "$5.00" : "$25.00");

This is an open source project and your contributions are welcomed and encouraged.

• Fork this repository
• For code snippets: (see Style-Guide)
  • add a markdown file to the src folder containing the JavaScript code
  • add a short clear descriptive to the "Code Snippets" section section in the readme.md file.
• For short informational Tips & Tricks (see Style-Guide)
  • add a short clear descriptive title followed by the Tip or Trick to the "Tips & Tricks" section in the readme.md file.
• Submit a Pull Request

Please follow this simple style-guide for all code contributions:

• Indent using spaces.
• camelCase all callables.
• Use semi-colons.
• Place a space after a conditional or function name, and its conditions/arguments. function (...) {...}
• Make sure to include comments
• Tips & Tricks should be no more than a pargraph or two, longer Tips & Tricks should be moved to a Code Snippets