Functional Programming.md

Programación Funcional

• Inmutabilidad: No modificamos el estado
• Funciones Puras:
  • Con un mismo INPUT siempre vamos a tener un mismo OUTPUT
  • No terner efectos secundarios:
    • Muta un estado global
    • Modificar archivos o realizar pedidos a internet
    • llamar efectos externos
    • loggear en la consola, modificar el DOM
    • llamar a otra función que tenga efectos secundarios
  • No hay estados compartidos
    • No utiliza variable externas
• Composición
  • Combinar funciones para devolver un valor
• Hacer pequeñas funciones y reutilizarlas
• First class y high order functions
  • Las funciones son utilizadas como cualquier tipo de dato
  • Funciones que toman funciones como parametros o devuelven funciones
  • redux-thunk y bind
• Recursión
• Facil de Testear
• Opuesto a la programación orientada objetos, no significa que no se puedan usar juntas

// No Puro
class User extends React.Component {
  getUserInfo() {
    // ...busca la información del usuario
  }

  render() {
    return (
      <Profile name={this.state.user.name} />
    )
  }

}
// Puro
function Profile(props) {
  return (
    <h1>{props.name}</h1>
  );
}

Estado no compartido

const x = { value: 1 }

const addOne = () => x.value += 1;

const mult2 = () => x.value *= 2;

mult2();
addOne();

console.log(x.value);

mult2();
addOne();

console.log(x.value);


// Programación Funcional


const y = { value: 1 };

const addOne = (y) => ({ ...y, { value: y.value + 1 } });

const mult2 = y => ({ ...y, { value: y.value * 2} });

mult2(y);
addOne(y);

console.log(y.value);


console.log(addOne(mult2(y));

Aplicación Parcial / Currying

const partial = (fn, arg1) => {
  return (arg2) => {
    return fn(arg1, arg2);
  };
};

const add = (a, b) => a + b;

const add2 = partial(add, 2);

add2(5); // 7
add2(9); // 11

const add5 = partial(add, 5);

add5(1); // 6

console.log(add5(add2(4)));

Composición

const compositionAnd = (fn1, fn2) => (arg) => fn1(arg) && fn2(arg);

const isPositive = x => x >= 0;

const isEven = x => !(x % 2);


const isPositiveAndEven = compositionAnd(isPositive, isEven);

isPositiveAndEven(5) // false
isPositiveAndEven(6) // true
isPositiveAndEven(-2) // false


const doubleMap = (arr) => {
  const arr2 = [];
  for (let i = 0; i < arr.length; i += 1) {
    arr2.push(arr[i] * 2);
  }
  return arr2;
}

const double = (n) => n * 2;
const doubleMap = arr => arr.map(double);
 

const map = (arr, fn) => {
  const arr2 = [];
  for (let i = 0; i < arr.length; i += 1) {
    arr2.push(fn(arr[i]));
  }
  return arr2;
}

const concat = (...arrs) => {
  const arr2 = [];
  for (let i = 0; i < arrs.length; i += 1) {
    for (let j = 0; j < arrs[i].length; j += 1) {
      arr2.push(arrs[i][j]);
    }
  }
  return arr2;
}


const users = [{
 hobbies: ['correr', 'ver pelis'],
}, {
  hobbies: ['dormir', 'programar'],
}, {
  hobbies: ['Jugar al fifa', 'comer'],
}
]

const compose = (fn1, fn2) => (...args) => fn2(fn1(...args)) 

const concatMap = compose(map, arrs => concat(...arrs))


concatMap(users, (user) => user.hobbies);

const arr = [1,2,3,4,5];


const result = doubleMap(arr.filter(isPositiveAndEven)).reduce((memo, num) => num + memo);