Functional programming in JavaScript by Kyle Simpson.
Imperative describes the code most of us probably already write naturally; it's focused on precisely instructing the computer how to do something. Declarative code -- the kind we'll be learning to write, which adheres to FP principles -- is code that's more focused on describing the what outcome.
A function is a collection of code that can be executed one or more times. Is it?
In math, a function always takes input(s), and always gives an output. A term you'll often hear around FP is "morphism"; this is a fancy way of describing a set of values that maps to another set of values, like the inputs of a function related to the outputs of that function.
A procedure is an arbitrary collection of functionality. It may have inputs, it may not. It may have an output (return
value), it may not.
A function takes input(s) and definitely always has a return
value.
So in Functional Programming, you should be using functions as much as possible, and trying to avoid procedures wherever possible. All your functions should take input(s) and return output(s).
function addNumbers(a = 0, b = 0, c = 0, d = 0) {
var total = a + b + c + d;
console.log(total);
}
function extraNumbers(a = 2, ...args) {
return addNumbers(a, 40, ...args);
}
extraNumbers(); //42
extraNumbers(3, 8, 11); // 62
function tuple(x, y) {
return [x + 1, y - 1];
}
var [a, b] = tuple(...[5, 10]);
a; //6
b; //9
So Function is the semantic relationship between input and computed output
// The name of the function tell us the semantic relationship.
function shippingRate(size, weight, speed) {
return (size + 1) * weight + speed;
}
function shippingRate(size, weight, speed) {
(size + 1) * weight + speed;
}
var rate,
size = 12,
weight = 4,
speed = 5;
shippingRate();
rate; //57
size = 8;
speed = 6;
shippingRate();
rate; //42
Side effects are both side causes, side indirect input and side indirect output.
Avoid (Minimize) side effects with function calls... if possible.
function shippingRate(size, weight, speed) {
return (size + 1) * weight + speed;
}
var rate;
rate = shippingRate(12, 4, 5); // 57
rate = shippingRate(8, 4, 6); // 42
By passing a direct input that returning a direct output and that's a function.
- I/O (console, files, etc)
- Database Storage
- Network Calls
- DOM
- Timestamps
- Random Numbers
- CPU Heat
- CPU Time Delay
No such thing as "no side effects" Avoid them where possible, make them obvious otherwise.
A function with no side causes/effects is called a pure function. A pure function is idempotent in the programming sense, because it cannot have any side effects. Consider:
// pure
function addTwo(x, y) {
return x + y;
}
// impure
function addAnother(x, y) {
return addTwo(x, y) + z; // what is z???
}
// Reducing Surface Area
// Better readability and more confidence.
function addAnother(z) {
return function addTwo(x, y) {
return x + y + z;
};
}
addAnother(1)(20, 21); // 42
-
Function parameters are variables (names listed) in a function definition.
-
Function arguments are the real values passed to (and received by) the function.
function functionName(parameters) {
// code to be executed
}
functionName(arguments); // Invoking a JavaScript Function named functionName with some arguments
Closure is when a function remembers the variables around it even when that function is executed elsewhere.
function makeCounter() {
var counter = 0;
return function increment() {
return ++counter;
};
}
var c = makeCounter();
c(); // 1
c(); // 2
c(); // 3
A closure is a function having access to the parent scope, even after the parent function has closed.