본문 바로가기

All

(220)
20210703 JavaSciprt DeepDive 01 : 변수, 표현식과 문, 데이터 타입, 연산자, 제어문 JavaScript Deep Dive 01 용어 및 중요사항 정리 변수 변수 : 확보한 메모리 공간 자체 or 메모리 공간 식별자 식별자 : 어떤 값을 구별해서 식별할 수 있는 고유한 이름(식별자는 값이 아니라, 메모리 주소를 기억함으로서 메모리 주소에 붙인 이름 역할을 함) 변수선언: 변수를 사용하기 위한 메모리 공간 확보와 변수 이름과 확보된 메모리 공간의 주소 연결 (값 저장 준비, var, let, const) 값 할당 없이 변수선언만 되어도, undefined가 기본으로 할당 되어 초기화 됨 변수 호이스팅 : 변수 선언문이 코드 작성 맨위로 올라 간듯이 동작하는 특징 변수 선언이 런타임 전에 실행되기 때문 (var, let, const, function, function*, class 키워드로 ..
20210702 Redux08 : redux-toolkit 사용법, createAction, createReducer, createSlice(reducers, extraReducers 작성법들), configureStore, createAsyncThunk Redux 08 redux-tookit 사용법 createAction, createReducer 방식 store middleware등의 환경을 건들지 안고 바로 적용할 수 있는 방식 하지만, 크게 코드가 줄어 들진 않음 createAction() redux-actions에서 제공하고 있던 createAction()과 같은 방식으로 작동한다. 기존의 Action creator를 세부적으로 만들 필요 없이 actionCreator를 통해서 type, payload 형태의 Actoin을 만들어줌 import { createAction } from "@reduxjs/toolkit"; const getUsersStart = createAction("GET_USERS_START"); const getUsersSuc..
20210701 Redux07 : vanilla redux vs redux-actions vs redux-toolkit Redux 07 redux-actions 활용과 느낌 기존 환경 redux-actions를 사용하는 경우, 기본적으로 다른 여러가지 패키지들과 사용하게 된다. redux-actions : 리덕스 액션스는 덕스 패턴을 만들때 편하게 작성시켜 코드를 좀더 깔끔하게 해준다. react-redux : redux와 react를 연결할 때 쓰는 Provider, 그리고 react에서 state의 값을 가져오거나, 변경하고자 할때 요청을 useSeletor, useDispatch를 통해서 쉽게 사용할 수 있게함 redux-thunk : 비동기 작업을 Action으로 수행하고, 해당 작업을 통해 가져온 데이터 같은 것을 redux에 반영하게 할 수 있음 redux-devtools-extension : 리덕스 작업시 브..
20210630 Algorithm 05 : 탐욕 알고리즘(동전, 부분배낭), 최단경로 알고리즘 이해, 다익스트라 알고리즘 Algorithm 05 Greedy algorithm(탐욕 알고리즘) 의 이해 Greedy algorithm 또는 탐욕 알고리즘 이라고 불림 최적의 해에 가까운 값을 구하기 위해 사용됨 여러 경우 중 하나를 결정해야 할 때마다, 매순간 최적이라고 생각되는 경우를 선택하는 방식으로 진행해서, 최종적인 값을 구하는 방식 총체적인 고려보단, 현재 활용하는 것에서 최적을 선택 탐욕 알고리즘 예 예시1: 동전 문제 지불해야 하는 값이 4720원 일 때 1원, 50원, 100원, 500원 짜리 동전으로 가장 적은 동전의 수로 값을 지불하는 경우 가장 금액이 큰 동전부터 최대한 지불해서 값을 채우는 방식으로 구현 가능 500원 짜리로 4500원까지 채우기 -> 9개 100원 짜리로 4700원까지 채우기 -> 2개 1..
20210629 Algorithm 04 : Binary Search(이진 탐색), Sequential Search(순차 탐색), Graph의 이해, BFS(너비우선탐색), DFS(깊이우선탐색) Algorithm 04 Binary Search (이진 탐색) 탐색할 자료를 둘로 나누어 해당 데이터가 있을만한 곳을 탐색하는 방법 정열이 되어 있다는 가정하에 순차적으로 탐색하지 않고, 중간을 탐색해서 어디에 있는지 판단하는 방식 분할 정복 알고리즘과 이진 탐색 분할 정복 알고리즘 : Divide(문제를 하나 또는 둘 이상으로 분할), Conquer(나눠진 문제가 충분히 작고, 해결가능하면 해결하고 그렇지 않으면 다시 분할함) 이진 탐색: Divide : 리스트를 두 개의 서브 리스트로 나눔 Conquer : 검색할 숫자 > 중간값 -> 뒷부분의 서브 리스트에서 검색할 숫자를 찾음 검색할 숫자 앞부분의 서브 리스트에서 검색할 숫자를 찾음 이진 탐색도 분할 정복 알고리즘에 해당하므로, 전..
20210628 Algorithm 03 : 동적 계획법(Dynamic Programming), 분할정복(Divide and Conquer), 퀵 정렬(Quick sort), 병합정렬(Merge sort) Algorithm 03 동적 계획법 (Dynamic Programming)과 분할 정복(Divide and Conquer) 동적 계획법 (DP) 입력 크기가 작은 부분 문제들을 해결한 후, 해당 부분 문제의 해를 활용해서, 보다큰 크기의 부분 문제를 해결, 최종적으로 전체 문제를 해결하는 알고리즘 상향식 접근법으로, 가장 최하위 해답을 구해서 이를 저장하고 해당 결과값을 이용해서 상위 문제를 풀어가는 방식 Memoization 기법을 사용 Memoization(메모이제이션) : 프로그램 실행시 이전에 계산한 값을 저장하여, 다시 계산하지 않도록 하여 전체 실행 속도를 빠르게 하는 기술 작은 문제에서의 결과값을 메모이제이션을 통해서 기억하고, 큰 문제에서는 따로 작은 문제를 다시 실행시키지 않고 기억하고 ..
20210625 Algorithm 02 : 공간 복잡도, 재귀용법(Recursive call), 재귀 패턴, 재귀용법 활용한 예제(리스트합, 회문, 홀짝, 123표현) Algorithm 02 공간 복잡도 시간 복잡도 : 얼마나 빠르게 실행 되는지 공간 복잡도 : 얼마나 많은 저장 공간이 필요한지 실행시간이 짧고, 공간도 적게쓰는 알고리즘이 좋은 알고리즘 둘다 만족시키기는 어려움 완전하진 않지만, 시간과 공간은 반비례적 경향이 있음 최근에는 대용량 시스템이 보편화 되면서, 시간복잡도를 우선시킴 공간 복잡도 대략적인 계산 필요함 기존 알고리즘 문제는 공간 복잡도 고려해서 만들어진 경우가 많아 시간 + 공간 복잡도에 대한 제약 사항이 있음 공간 복잡도 프로그램을 실행 및 완료하는데 필요한 저장공간의 양을 뜻함 총 필요 저장 공간 고정 공간 (알고리즘과 무관한 공간): 코드 저장 공간, 단순 변수 및 상수 가변 공간 (알고리즘 실행과 관련 있는 공간) : 실행 중 동적으로 필..
20210624 Algorithm 01 : 알고리즘, Bubble sort(버블 정렬), Selection sort(선택정렬), Insertion sort(삽입 정렬) Algorithm 01 알고리즘 실제로 개발자들이 해당 알고리즘을 하나하나 작성하여 쓰지는 않음, 모두 좋은 패키지로 함수화 되어 나와 있음 그럼에도 익히는 이유는 지금까지 존재하는 알고리즘 중에 잘 만들어진 알고리즘을 익힘으로서 잘 알고리즘을 만들수 방법을 잘 이해하고, 이를 기반으로 새로운 문제들을 풀수 있는 능력을 기르기 위함 알고리즘 연습 방법 효과적인 알고리즘을 작성하기 위해서는 바로 코드를 작성하지 말고, 전통적인 알고리즘 연습 방법으로 진행하자 문제를 쓰고, 연습장에 고안해서 최종적으로 에디터에 코드를 작성해서 테스트를 함 효율적인 알고리즘을 고안을 하고 테스트를 해야함 연습장과 펜 준비 알고리즘 문제를 읽고 분석 간단하게 테스트용으로 매우 간단한 경우부터 복잡한 경우 순서대로 생각해보면서,..
20210623 DataStructure 07 : Heap(힙), 힙 vs 이진 탐색 트리, 힙 동작 구조, python으로 힙 구현하기(배열활용), 힙의 시간복잡도 DataStructure 07 Heap (힙) 힙: 데이터에서 최대값과 최소값을 빠르게 찾기 위해 고안된 완전 이진 트리(Complete Binary Tree) 완전 이진 트리: 노드를 삽입할 때 최하단 왼쪽 노드부터 차례대로 삽입하는 트리 힙을 사용하는 이유 배열에 데이터를 넣고, 최대값과 최소값을 찾으려면 O(n)이 걸림 힙에 데이터를 넣고, 최대값, 최소값을 찾으면 O(log n)이 걸림 우선순위 큐와 같이 최대값, 최소값을 빠르게 찾아야 하는 자료구조 및 알고리즘 구현 등에 활용됨 힙(Heap) 구조 힙의 구조는 2 가지로, 최대 값을 구하기 위한 구조(Max Heap) 와 최소값을 구하기 위한 구조(Min Heap) 중에서 1개를 가지게 된다. Max Heap : 최대 값이 root Node를 ..
20210623 Redux06 : redux-saga, ES06 Generator 함수 문법, redux-saga 세팅&활용, redux-actions Redux 06 redux-saga 미들웨어 제너레이터 객체를 만들어 내는 제너레이터 생성 함수를 이용 리덕스 사가 미들웨어를 설정 -> 자신이 만든 사가 함수 등록 -> 사가 미들웨어 실행 -> 등록된 사가함수를 실행할 액션을 디스패치 함 npm i redux-saga redux-saga by 밸로퍼트 아래 부터는 밸로퍼트님의 redux-saga를 참고하여 작성 하였습니다. redux-thunk가 하지 못하는 일을 redux-saga가 할수 있게 해줌 비동기 작업을 할 때 기존 요청 취소 처리 특정 액션 발생시 다른 액션이 디스패치 되게처리 또는 JS 코드 실행 처리 API 요청이 실패 했을 때 재요청 작업 가능 등의 까다로운 비동기 작업들에서 사용 Generator 함수 Generator 함수의 경우..
20210622 DataStructure 06 : Tree (트리), Binary Tree(이진 트리), Binary Search Tree(이중 탐색 트리), python으로 이진 탐색 트리 구현 DataStructure 06 Tree (트리) 자료구조이기도 하지만, 알고리즘 같은 로직도 많이 들어가서 알고리즘의 느낌도 있음 실제로 구현시 난이도가 높음 Tree(트리) : Node와 Branch를 이용해서, 사이클을 이루지 않도록 구성한(사이클 관계X) 데이터 구조 이진 트리 (Binary Tree) 형태의 구조로, 검색 알고리즘 구현을 위해 많이 사용됨 용어 Node : 트리에서 데이터를 저장하는 기본 요소 (데이터와 다른 연결된 도드에 대한 Branch 정보 포함) Root Node : 트리 최상위 노드 Level : 최상위 노드를 Level 0으로 하였을 때, 하위 Branch로 연결된 해당 노드의 깊이 Parent Node : 어떤 노드의 상위 레벨을 이루는 노드 (부모 노드) Child ..
20210621 Redux05 : Ducks Pattern, react-router + redux (history Thunk 방식, connected-react-router방식) Redux 05 Ducks Pattern 어떤 라이브러리가 아닌, 많은 사람들이 redux를 가지고 코드를 짜는 좋은 패턴을 말함 ducks-modular-redux by JisuPark 기존 redux에서 ActionCreator, reducer, type이 계속 한 벌씩 생성되므로, 이를 한 묶음으로 모듈화 하여 관리하는 패턴을 제안함 ActionCreator, reducer, type을 한벌로 만들어 모듈화 시키고 해당 모듈을 combine하여 하나의 reducer로 만들어 해당 reducer로 store을 만들게 됨 Ducks : 1모듈 규칙 항상 reducer()란 이름의 함수를 export default 해야합니다. Combine시에 해당 파트 이름으로 불러와 사용하면 되기 때문에 항상 모듈의..
20210620 DataStructure 05 : Hash Table(해쉬 테이블), 충돌(Collision), 충돌 해결법(Chaining, Linear Probing), 충돌 개선법, SHA(안전한 해시 알고리즘) DataStructure 05 Hash Table (해쉬 테이블) 해쉬 구조 키(key)에 데이터(value)를 저장하는 데이터 구조 해쉬는 key를 가지고 hash 함수를 계산하면 data가 저장되어야 할 위치(되어 있는 위치)가 나옴 배열은 어떤 데이터를 검색하는 경우 전체 데이터를 순회해야함 하지만, hash는 순회할 필요 없이 해당 데이터의 key만 hash 함수로 계산하면 바로 데이터가 저장되어 있는 위치가 나오기 때문에 성능이 엄청 좋음 Python의 딕셔너리(Dictionary) 타입이 해쉬 테이블의 예임 (key - value 구조) 그래서, 파이썬에서는 해쉬를 별도 구현할 이유가 없음 - 딕셔너리 타입을 사용하면 됨 보통 배열로 미리 Hash Table 사이즈 만큼 생성 후에 사용(공간과..
20210618 Redux04 : MiddleWare(미들웨어), 미들웨어 라이브러리(Redux-devtools, Redux-thunk, Redux-promise-middleware) Redux 04 Redux MiddleWare (리덕스 미들웨어) Redux : MiddleWare velopert : Redux MiddleWare 미들웨어가 dispatch 의 앞뒤에 코드를 추가할 수 있게 해줌 dispatch 메소드를 통해 store로 가고 있는 Action을 가로채는 코드 미들웨어가 여러개면 미들웨어가 순차적으로 실행됨 스토어를 만들때, 미들웨어를 설정함 applyMiddleware()함수로 미들웨어들을 묶어서 createStore()함수의 두번째 인자로 넣어줌 디스패치가 호출 될때 실제로 미들웨어를 통과하는 부분 디스패치가 호출 될때 마다 미들웨어에서 action을 인자로 받는 부분이 실행됨 next() : next()가 호출된 곳의 미들웨어 다음에 다른 미들웨어가 있는 경우 ..
20210618 DataStructure 04 : 알고리즘 복잡도, 시간 복잡도, 알고리즘 성능 표기법, Big-O, 시간 복잡도 계산해보기 DataStructure 04 시간 복잡도 : 알고리즘 복잡도 표현 방법01 하나의 문제를 푸는 알고리즘은 다양할 수 있는데, 다양한 알고리즘 중 어느 알고리즘이 더 좋은지 분석하기 위해서 복잡도를 정의하고 계산함 (성능의 판단 기준) 예) 정수의 절대값 구하기 : 방법01 - 정수값을 제곱하여 루트사용 / 방법02 - 양수는 그대로 , 음수는 -1을 곱해서 출력 -> 둘중 어떤것이 좋은 것인지 알아야 할 필요는 있음 알고리즘 복잡도 계산 항목(요소) 알고리즘의 성능을 판단하는 알고리즘 복잡도에 대한 계산 항목이 존재한다. 시간 복잡도 : 알고리즘 실행 속도 공간 복잡도 : 알고리즘이 사용하는 메모리 사이즈 둘을 비교하자면, 가장 중요한 건 실행 속도이므로 시간 복잡도를 필수적으로 이해하고 계산할 수 있..
20210617 DataStructure 03 : 연결 리스트(Linked List), 이중 연결 리스트(Double Linked List) DataStructure 03 Linked List (연결 리스트) Linked List 구조 연결 리스트라고도 함 배열은 순차적으로 연속된 공간에 공간 개수를 예약을 해서 데이터를 나열하는 데이터 구조 이러한 배열의 단점을 보완한 데이터 구조가 연결 리스트 임 연결 리스트는 떨어진 곳에 존재하는 데이터를 화살표로 연결해서 관리하는 데이터 구조 연결 리스트의 경우 공간이 연속되지 않고, 공간을 미리 예약을 하지 않고 필요할때 마다 공간을 추가 할수 있음(무한정 데이터를 저장 할 수 있음) C언어에서는 주요한 데이터 구조인데, 파이썬은 list type이 연결 리스트 기능을 모두 지원함 배열은 1개의 공간에 1개의 데이터를 관리하지만, 연결리스트의 경우 배열과 달리 특정한 데이터를 저장하는 경우, 해당 데..