기본개념 간단하게 정리[JavaScript]

redux-saga란?

redux-thunk 다음으로 많이 사용되는 라이브러리이다.

 

redux-thunk의 경우엔 함수를 디스패치를 할 수 있게 해주는 미들웨어이다

redux-saga의 경우에는 액션을 모니터링하고 있다가, 특정 액션이 발생하면 이에 따라 특정 작업을 하는 방식을 사용한다.

 

특정작업이란, 특정 자바스크립트를 실행하는 것 일수도 있고, 다른 액션을 디스패치 하는 것 일수도 있고, 현재 상태를 불러오는 것 일수도 있다.

 

redux-saga의 특징

1. 비동기 작업을 할 때 기존 요청을 취소 처리 할 수 있다.

2. 특정 액션이 발생했을 때 이에 따라 다른 액션이 디스패치되게끄 하거나, 자바스크립트 코드를 실행 할 수 있다.

3. 웹소켓을 사용하는 경우 Channel이라는 기능을 사용하여 더욱 효율적으로 코드를 관리 할 수 잇다.

4. API 요청이 실패했을 때 재요청하는 작업을 할 수 있다.

 

 

자바스크립트 변수선언

자바스크립트에서 변수를 사용하려면 선언이 필요하다. 변수를 선언할 때는 var, let, const 키워드를 사용한다. ES6에서 let, const 키워드가 도입되기 이전까지 var 키워드는 자바스크립트에서 변수를 선언할 수 있는 유일한 키워드였다.

 

 

 

var키워드의 단점

var 키워드의 여러 단점 중에서 가장 대표적인 것이 블록 레벨 스코프(block-level scope)를 지원하지 않고 함수 레벨 스코프(function-level scope)를 지원하다는 것이다. 이로 인해 의도치 않게 전역 변수가 선언되어 심각한 부작용이 발생한다.

 

Function level

함수 밖에서 선언한 함수 스코프 변수는 전역 범위를 가지고, 함수 안에서 사용하면 함수 밖을 제외한 내부 어디서든 접근이 가능하다.

 

Block level

블록은 0개 이상의 구문(statement)을 묶기위해 사용하고, 중괄호{}로 경계를 구분한다. 

블록 스코프 변수는 함수 밖에서 선언하면 함수 스코프 변수처럼 전역 접근할 수 있다. 블록 안에서 선언하면 자신을 정의한 블록과 하위 블록에서만 접근이 가능하다.

 

const란

const 키워드는 읽기 전용 변수, 즉 값을 재할당 할 수 없는 상수를 선언할 때 사용

 

변수 호이스팅

var 키워드로 변수를 선언하면 변수 호이스팅에 의해 변수 선언문이 스코프의 선두로 끌어 올려진 것처럼 동작한다.

즉, 변수 호이스팅에 의해 var 키워드로 선언한 변수는 변수 선언문이전에 참조할 수 있다.

단, 할당문 이전에 변수를 참조하면 언제나 undefined를 반환한다.

 

// 이 시점에는 변수 호이스팅에 의해 이미 foo 변수가 선언되었다(1. 선언 단계)
// 변수 foo는 undefined로 초기화 된다(2. 초기화 단계)
console.log(foo); // undefined
 
// 변수에 값을 할당(3. 할당 단계)
foo = 123;
 
console.log(foo); // 123
 
// 변수 선언은 런타임 이전에 자바스크립트 엔진에 의해 암묵적으로 실행된다.
var foo;

호이스팅 실제 출력값

 

 

 

 

 

 

베타존 : 네이버쇼핑 스마트스토어