An Introduction to Functional Programming

Samuel Silva

Part 02

Higher Order Function

In mathematics and computer science, a higher-order function is a function that does at least one of the following:

 

- takes one or more functions as arguments (i.e. procedural parameters),

- returns a function as its result.

// Currying

const add = x => y => x + y;

const addX = add(1); // y => y + 1

const result = addX(2); // 3


// Map

const mapOverItems = map(value => value + 1, [1, 2, 3]);


mapOverItems([1, 2, 3]); // [2, 3, 4]


// Function composition

const addValues = compose(add(2), add(1));

const result = addValues(2); // 5


Curry Functions

Partial Application

In mathematics and computer science, currying is the technique of translating the evaluation of a function that takes multiple arguments into evaluating a sequence of functions, each with a single argument. Currying is related to, but not the same as, partial application.

 

Wikipedia

const addFn = x => y => x + y
const addValues = compose(addFn(1), addFn(2))

addValues(1)

Curry functions are extremely important when working with functional programming since they give us the ability to compose functions.

const request = options => {
  return fetch(options.url, options)
     .then(resp => resp.json())
}

const userPromise = request({
  url: '/users',
  headers: { 'X-Custom': 'my-key' }
})

const taskPromise = request({
  url: '/users',
  headers: { 'X-Custom': 'my-key' }
})

A practical example of partial application:

Repetitive

const request => default => options => {
   return request({...default, ...otherOptions})
}

const customRequest = request({
   headers: { 'X-Custom': 'my-key' }
})

const usersPromise = customRequest({ url: '/users' })

const tasksPromise = customRequest({ url: '/tasks' })

const clientsPromise = customRequest({ url: '/clients' })

all functions are sharing the same headers now

Function Composition

compose(fn, fn, fn)

In mathematics, composing two functions is a chaining process in which the output of the inner function becomes the input of the outer function.

Wikipedia

compose

const compose = (f, g) => x => f(g(x));

const add = x => y => x + y;

const addOne = add(1);

const addTwo = add(2);

const addOneAndTwo = compose(addTwo, addOne);

const result = addOneAndTwo(1); // 4

our compose function is amazing, but what happens if I try to compose many functions. 

const compose = (f, g) => x => f(g(x));

const add = x => y => x + y;

const addOne = add(1);

const addTwo = add(2);

const addThree = add(3);

const addOneAndTwoAndThree = compose(addThree, addTwo, addOne);

const result = addOneAndTwoAndThree(1); ?

Ok, let's create our enhanced compose function!

const compose = (...fns) => {
	return fns.reduceRight((prevFn, currentFn) => {
		return (...args) => {
			return currentFn(prevFn(...args))
		}
	})
}

const add = x => y => x + y;

const addOne = add(1);

const addTwo = add(2);

const addThree = add(3);

const logger = 	value => console.log('My Value is', value);

const addOneAndTwoAndThree = compose(
	logger,
	addOne, 
	addThree, 
	addTwo,
	addOne
);

addOneAndTwoAndThree(1);

Coming Next:

  • Ramda.js
  • Functional Programming with React.js

Questions?

Made with Slides.com