FunctionalTypes and AbstractionsSibelius Seraphini

Sibelius Seraphini

@sibelius

@sseraphini

Before Functions

Loading

Before Functions

Loading

You can't write complex software without functions

After Functions

Loading

After Functions

Loading

What is a Function

an abstraction
lazy reusable chunks of code
optional input (the arguments)
optional output (the return)
f(I) -> O

JavaScript Abstraction Pyramid

Pure Functions

same Input, same Output
no side effects
easy to test

const add = (x, y) => x + y;

Immutability

predictable state
history
enable parallelization (no race condition)

The true constant is change. Mutation hides change. Hidden change manifests chaos. Therefore, the wise embrace history.

Types

Types are set of values
string: set of characters
int: set of numbers
date: set of datatime

Category Theory: Functions + Types

Function have an Input and an Output type

const sum = (a: number, b: number): number => a + b;

(number, number) => number

Function composition

you can't compose any 2 functions
the Output of one should match the Input of another

First class functions

pass functions as arguments
store functions on variables
return functions from functions
anonymous functions

Composing Functions

Loading

Composing Functions

Loading

Composing Functions - compose

Loading

Point Free Style

Loading

Higher Order Functions

A function that receive functions and return another function
Cross cutting concerns

Higher Order Components

const SnackbarContext = React.createContext({
  // eslint-disable-next-line
  showSnackbar: (args) => {},
});
export default function withSnackbar(
  WrappedComponent,
) {
  const ConnectedSnackbar = (props) => {
    return (
      <SnackbarContext.Consumer>
        {({ showSnackbar }) => <WrappedComponent {...props} showSnackbar={showSnackbar} />}
      </SnackbarContext.Consumer>
    );
  };
  return ConnectedSnackbar;
};

Curry, Partial Application

Loading

Fantasy Land

Setoid

Loading

Ord

Loading

Semigroup

Loading

Monoid

Loading

Filterable

Loading

Functor

Loading

Foldable

Loading

Algebraic Data Types

Product Type
Sum Type

Product Type

class Pair<U, V> {
  constructor(x: U, y: V) {}
}

Sum Type

type payload =
  | BadResult(int)
  | GoodResult(string)
  | NoResult;

Pattern Matching

let message =
  switch (data) {
  | GoodResult(theMessage) => "Success! " ++ theMessage
  | BadResult(0 | 1 | 5) => "Something's wrong. It's a server side problem."
  | BadResult(errorCode) => "Unknown error occurred. Code: " ++ string_of_int(errorCode)
  | NoResult => "Things look fine"
  };