본문 바로가기
JS 실행 컨텍스트 실행 컨텍스트, execution context란? - 실행할 코드에 제공할 환경 정보들을 모아놓은 객체 - 어떤 실행 컨텍스트가 활성활 될 때 자바스크립트 엔진은 해당 컨텍스트에 관련된 코드들을 실행하는데 필요한 환경정보들을 수집해서 실행 컨텍스트 객체에 저장하고 이를 call stack에 쌓는다. - 스택 구조상 call stack의 맨 위에 쌓이는 컨텍스트와 관련있는 코드가 현재 실행되며, 이런 방식으로 전체 코드의 환경과 순서를 보장한다. - 실행 컨텍스트 객체는 다음과 같은 정보를 담고 있다 : VariableEnvironment, LexicalEnvironment, ThisBinding VariableEnvironment와 LexicalEnvironment - VariableEnvironmen.. 2020. 11. 7.
JS 데이터 타입 자바스크립트 변수와 식별자 - 변수 : 변할 수 있는 데이터를 담는 공간 - 식별자 : 데이터를 식별하는 데 사용하는 이름 -> 변수명, 메모리 주솟값 자바스크립트 데이터 타입 primitive type - number, string, boolean, null, undefined - 값이 담긴 주솟값을 변수에 저장 - 값이 달라지면 무조건 새로운 메모리 공간에 새로운 값을 저장하고 해당 새로운 메모리 공간의 주솟값을 변수에 할당한다. => 한 번 만든 값은 바꿀 수 없고 값의 변경은 새로 만드는 동작을 통해서만 이루어진다. 한 번 만들어진 가비지컬렉팅을 당하지 않는 한 영원히 변하지 않는다 : 불변성의 성질! var a = 1; var b = a; // a 와 b는 1이 담긴 같은 메모리 주소를 저장하고.. 2020. 11. 7.
14. Redux-middleware - 리액트 웹 애플리케이션에서는 API 요청에 대한 상태도 잘 관리해야 한다 - 리액트 웹 애플리케이션에서 리덕스를 사용하고 있으며 api 요청과 같은 비동기 작업을 관리해야 한다면 middleware를 사용하여 효율적으로 상태를 관리할 수 있다 middleware란? - 리덕스 미들웨어는 액션을 디스패치했을 때 리듀서에서 이를 처리하기에 앞서 사전에 지정된 작업들 실행하는 액션과 리듀서 사이의 중간자 - 미들웨어가 하는 작업 예시 1 : 전달받은 액션을 콘솔에 기록 - 미들웨어가 하는 작업 예시 2 : 전달받은 액션을 취소하거나 다른 종류의 액션을 추가로 디스패치 - 대표적인 미들웨어 : redux-thunk, redux-saga redux-thunk - 비동기 작업을 처리할 때 많이 사용하는 미들웨어.. 2020. 11. 6.
13. React-Redux React-Redux란? - Redux를 React App에서 효율적으로 사용하기 위해 여러 유틸함수와 Provider 컴포넌트를 제공하는 라이브러리 Presentational Component and Container Component Patterns - 리액트 프로젝트에서 리덕스를 사용할 때 가장 많이 사용하는 패턴 - Presentational Component : 상태관리가 이루어지지 않고, 그저 props를 받아서 화면에 UI를 보여 주기만 하는 컴포넌트 - Container Component : 리덕스와 연동되어 있는 컴포넌트로, 리덕스로부터 상태를 받아오거나 리덕스 스토어에 액션을 디스패치한다. - 리액트 프로젝트에 리덕스를 적용하여 업데이트에 관련된 로직(container)을 리액트 컴포넌.. 2020. 11. 6.
12. Redux 리덕스란? - 상태 관리 라이브러리 - 컵포넌트의 상태 업데이트 관련 로직을 다른 파일로 분리시켜서 효율적으로 관리 가능 - 컴포넌트들간에 공유되는 상태를 여러 컴포넌트를 거치지 않고 손쉽게 상태 값 전달 및 업데이트 가능 - 전역상태를 효율적이고 체계적으로 관리 가능 - 미들웨어 기능을 이용하여 비동기 작업을 효율적으로 처리 리덕스 기초 개념 1. 액션, action - 어떤 상태로 변화하는지 'type'이라는 키의 값으로 표현하는 하나의 객체 - type 키의 값 이외의 값들은 상태 업데이트시 참고하는 값 // action example { type:'ADD_TODO', data:{ id:1, text:'redux 공부' } } 2. 액션 생성 함수, action creator - 액션 객체를 만들어.. 2020. 11. 6.
MVC 패턴 소프트웨어 아키텍쳐 와 디자인 패턴 - 소프트웨어 아키텍처란, 소프트웨어의 특성을 고려하여 소프트웨어의 구성요소들 사이의 관계를 표현하는 것으로 이후 소프트웨어의 설계와 업그레이드를 통제하는 원칙이된다. - 디자인 패턴이란, 소프트웨어의 모듈들이 어떤 기능을 하는지, 클래스의 범위, 함수의 목적 등 코드 수준의 디자인을 표현하는 것으로, 상황에 따라 자주 쓰이는 설계 방법들을 정리하여 재사용하기 좋은 형태로 패턴화 시켰다. MVC (Model , View , Controller) 패턴 - 정의 : 대표적인 디자인 패턴중 하나로, 하나의 애플리케이션을 Model , View , Controller 세가지의 역할로 구분한 패턴 - 장점 : 사용자 인터페이스로부터 비즈니스 로직을 분리하여 애플리케이션의 시각적.. 2020. 10. 30.

티스토리툴바