2021년 2월 22일 복기 (TIL Redux)

https://www.youtube.com/watch?v=poQXNp9ItL4

What is redux???

글쎄 생각해보자

오늘의 학습목표

Functions as First-Class Citizens

function sayHello() {
  return function () {
    return "Hello World";
  };
}

let fn = sayHello();
let message = fn();

Higher-order Functions

function greet(fn) {
  console.log(fn());
}

function sayHello() {
  return function () {
    return "Hello World";
  };
}

let numbers = [1, 2, 3];

numbers.map((number) => number * 2);

setTimeout(() => console.log("Hello"));

Functional Composition

let input = "  JavaScript   ";

let outpu = "<div>" + input.trim() + "</div>";

const trom = (str) => str.trim();

const wrapInDiv = (str) => `<div> ${str}</div>`;
const toLowerCase = (str) => str.toLowerCase();

const result = wrapInDiv(toLowerCase(trim(input)));
// trim
// wrapInDiv

Composing and Piping

import { compose, pipe } from "lodash/fp";

const transform = pipe(trim, toLowerCase);
transform(input);

const result = wrapInDiv(toLowerCase(trim(input)));

const transform = pipe(trim, toLowerCase, wrapinDiv);
transform(input);

Currying

import { compose, pipe } from "lodash/fp";

let input = "   JavaScript   ";

let output = "<div>" + input.trim() + "</div>";

const trim = (str) => str.trim();
const wrap = (type, str) => `<${type}>${str}</${type}>`;
const toLowerCase = (str) => str.toLowerCase();

const transform = pipe(trim, toLowerCase, wrap);

=>

console.log(transform(input));

function add(a) {
  return function (b) {
    return a + b;
  };
}

const add2 = (a) => (b) => a + b; //(a,b) => a + b

const add1 = add(1);

add1(5);

add(1)(5);

Pure Functions

function inEligible(age, minAge) {
  return age > minAge;
}

Immutability

let name = "Mosh";

let newName = name.toUpperCase();

let book = {};

book.title = "...";

const person = {
  name: "John",
  address: {
    country: "USA",
    city: "San Francisco",
  },
};

const updated = {
  ...person,
  address: {
    ...person.address,
    city: "New York",
  },
  name: "Bob",
};

console.log(person);

{ name: 'John', 
  address: { country: 'USA', city: 'San Francisco' } } 

Updating Arrays

const numbers = [1, 2, 3];

// Adding

const added = [...numbers, 4];