📌 라이브러리 설치 방법

$ yarn add redux-saga

📌 주요 함수

🔹 사용법

import { 사용할 함수명 } from 'redux-saga/effects';

---

🔹 takeEvery

들어오는 모든 액션에 대해 특정 작업을 처리

• ex
  

    takeEvery(INCREASE_ASYNC, increaseSaga)

    // 들어오는 모든 `INCREASE_ASYNC`액션에 대해 increaseSaga 함수 실행

🔹 takeLatest

가장 마지막 실행된 작업만 수행 (기존 진행 중이던 작업 有 → 취소 처리)

• 여러 액션이 중첩되어 디스패치 되었을 때 → 가장 마지막 액션만 처리 (기존 것들 무시)

• ex
  

    takeLatest(DECREASE_ASYNC, decreaseSaga)

    /* `DECREASE_ASYNC`액션에 대해서 기존에 진행 중이던 작업이 있다면 
    취소 처리하고 가장 마지막으로 실행된 작업에 대해서만 
    decreaseSaga함수를 실행 */

🔹 delay

설정된 시간 이후에 resolve하는 Promise객체를 리턴

• ex

  delay(1000)→ 1초 기다리기

🔹 put

특정 액션을 디스패치

• ex
  

    put({type: 'INCREMENT']})

🔹 all

여러 사가 합치는 역할

🔹 call

첫 번째 파라미터: 함수(호출하고 싶은)
나머지 파라미터: 해당 함수에 넣을 인수

• 형태: call(함수, 함수의 인자)
• ex

    // = request(action.payload)
    call(request, action.payload);

    // 딜레이 함수로 활용 가능
    // = delay(1000)
    call(delay, 1000)

🔹 select

현재 상태 조회 (사가 내부에서)

• 사용 예시
  

    select(state => state.counter) // state 의미: 스토어 상태

🔹 throttle

사가 실행 주기 제한

• 사가가 n초에 1번만 호출되도록 설정 가능

• 형태 & 원리
  

    throttle(n초 * 1000, 액션명, 작업명);

    /*  
    원리 :
    - n초 동안 작업을 새로 수행x
    - 동시에 가장 최신의 액션(액션명에 해당하는)을 `buffer`에 넣음
      ⇒ n초의 지연 주기 사이에 (발생하는 해당 액션은 모두 놓치고) 최대 하나의 해당 액션 수행*/

• 예시
  

    throttle(3000, INCREASE_ASYNC, increaseSaga);

---

참고

• 벨로퍼트_리액트를 다루는 기술