README.md

Functions

OOP vs. Functional is Dead	6/7/25
Bye Bye, Try-Catch Blocks: Meet JavaScript's Safe Assignment Operator Proposal😉	8/28/24
8 Reasons to Tell You, Please Stop Using the forEach Function	4/29/23
5 JavaScript Decorator Tricks That Will Catch Your Eye	7/7/23

2021 Articles

How to use named functions as callbacks in your JavaScript	7/3
Arrow functions in vanilla JS	6/3
A custom event helper function	4/26
10 Fundamentals You Need To Know About Functions in Javascript	4/3
Rest parameters in JavaScript functions	3/21
The arguments object in JavaScript functions	3/20
Default parameter values in vanilla JS	2/2
When to use a function declaration vs. a function expression	1/2

2020 Articles

A Common JavaScript Interview Question Asked By Google & Amazon	11/7
Enforcing a maximum number of parameters for a function in vanilla JS	10/14
Javascript - Curried Functions Basics [ES6]	10/11
Arrow Function Best Practices	7/1
How to set default function arguments with vanilla JS	6/26
JavaScript Fundamentals: Mastering Functions	5/9
I never understood JavaScript closures	3/11
How to impress interviewers by using recursion in JavaScript with ES6 features	3/5
What is hoisting in vanilla JavaScript?	1/22/2020
Callbacks in JavaScript	1/8/2020
Arrow function

Methods

.apply()	The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object).
.bind()	returns copy of function where this is set to the first argument passed into .bind()
.call()	The call() method calls a function with a given this value and arguments provided individually.

Hoisting

variable declarations && function declaration, hoisted or moved to the top of the file

Closure

A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function’s scope from an inner function. In JavaScript, closures are created every time a function is created, at function creation time.

{% code title="Function definition" %}

function functionName(parameter = 'default value') { //scope start
  const functionBody = 'do something';
  return functionBody; //return statement
} //end scope

const capturedVal = functionName(0, arguments);

{% endcode %}

Function types

{% code title="Regular function declaration" %}

function doctorize(firstName) {
  return `Dr. ${firstName}`;
}

{% endcode %}

{% code title="Anon function" %}

function (firstName) {
  return `Dr. ${firstName}`;
}

{% endcode %}

{% code title="Function expression" %}

const doctorize = function (firstName) {
  return `Dr. ${firstName}`;
}

{% endcode %}

{% code title="Arrow function" %}

const inchesToCM = inches => inches *2.54;

//function inchToCM(inches) {
// const cm = inches * 2.54;
// return cm;
//}

{% endcode %}

{% code title="IIFE - immediately invoked function expression" %}

(function() {
  console.log('Running the Anon function');
return;
})();

{% endcode %}

{% code title="Methods!!!" %}

const wes = {
  name: 'Wes Bos',
  //Method!
  sayHi: function() {
    console.log('Hey Wes');
    return 'Hey Wes';
  },
  //Shorthand method
  yellHi() {
    console.log('HEY WESSSSS');
  },
  //arrow function
  whisperHi: () => {
    console.log('heeyyy wess');
  }
}

{% endcode %}

{% code title="Callback Functions" %}

//Click Callback
const button = document.querySelector('.clickMe');

function handleClick() {
  console.log('Great Clicking!!!');
}

button.addEventListener('click', handleClick);

//Timer Callback
setTimeout(function() {
  console.log('DONE! Time to eat!!');
}, 1000);

{% endcode %}

{% code title="High order Function" %}

async function go() {
  const pizza = await makePizza(['pineapple']).catch(handleDisgustingPizza);
  return pizza;
}
 // catch it at run time
go().catch(handleError);
// make a safe function with a HOF
function makeSafe(fn, errorHandler) {
  return function () {
    fn().catch(errorHandler)
  }
}

const safeGo = makeSafe(go, handleError);

safeGo();

{% endcode %}