Dog foot print

javascript의 배열은 array-list라는 것의 형태를 띄고 있어 배열의 크기 존재하지 않는다. 그런데 c 같은 언어들은 배열의 크기가 존재하기에 한 배열을 유한하게 밖에 사용 할 수 없다. 그래서 개발자들은 노드리스트라는 개념을 만들어 각각의 구조체들로 서로를 연결하는 것을 만들었다. 연결리스트에는 단순 연결리스트, 이중연결리스트, 원형연결리스트가 있으며 이 연결리스트들을 이용하여 스택, 큐, 트리등 다양한 자료구조를 만들 수 있다. node 란 node란 data필드와 link필드를 가지고 있는 일종의 구조체로 link를 통해서는 다음 연결된 노드에 접근 할 수 있다. simple linked-list는 처음 노드를 header라고 하며 마지막 노드의 link는 항상 null이다. 연결리스트..

C-R-A 란 create-react-app node module 의 약자로 리액트 프로젝트를 쉽게 만들 수 있게 필요한 모듈혹은 설정을 포함하는 보일러 플레이트이다.( C-R-A 가 없다면 우리는 바벨, eslint, 웹팩등을 직접 하나하나 설치하고 해당 파일을 일일히 설정 해주어야 할 것이다. ) 또한 C-R-A 는 페이스북에서 직접 관리하고 있으니 꾸준히 업데이트되는 장점도 있다. C-R-A의 설치 먼저 노드가 global로 설치가 되지 않았다면 노드를 먼저 설치한다. https://nodejs.org/en/ 다음 본인의 node 패키지 환경에 따라 터미널에 다음과 같이 작성 한다. npm을 사용하는 경우 npm install -g create-react-app yarn을 사용하는 경우 yarn a..

c언어나 c++같은 언어를 배우는 사람들은 swap(int a, int b) 같은 함수를 만들때 인자로 그냥 일반자료형이 아니라 포인터라는 것을 넘겨주어야 우리가 원하는 결과가 나오는 것을 알것이다. 그러나 다행스럽게도(?) 자바스크립트에서는 포인터가 없다. 이 포인터라는 것이 없기 때문에 javascript에서는 함수의 인자로 기본자료형(string, numb, undefined,bullean,null)이 들어 왔을때 값을 복사한 변수를 새로 메모리에 만들게 된다. 그로인하여 함수의 결과는 새로운 메모리의 값을 변경하는 행위가 되고 실제 인자로 들어온 변수들의 메모리의 값을 변경하는 행위는 하지 못한다. 예제 let a = 10; let b = 20; function swap(x,y){ let temp..

이전까지 stack, sicle queue, queue 를 만들었지만 전부 다 단방향에서 아이템을 꺼내와야 하는 불편함이 있었다. 그러나 원형 큐의 아종인 덱이라는 녀석은 앞과 뒤 모든 방향에서 데이터를 추가 및 삭제 할 수 있는데 오늘은 이 녀석을 만들어 볼 예정이다. 덱 Deck 덱은 원형 큐와 마찬가지로 배열에 빈 공간이 있다면 데이터를 추가 할 수 있는 구조를 하고 있어 원형 큐와 마찬가지로 덱 또한 원형 구조를 하고 있다. 덱의 멤버변수 constructor(size){ this.maxQueueSize = size; this.array = []; this.front = 0; this.rear = 0; } 원형 큐와 동일한 front , rear를 가지고 있다. 덱의 메서드 __주의__ addRe..

나는 es6부터 javascript를 접했기 때문에 훨씬 좋은 환경에서 웹개발을 배웠다 생각한다. es6에서는 arrow-function , class, const와 let의 출현 , promise 객체 등 개발자에게 코드의 간결성, 명확성을 선물해주었지만 현실은 es6 를 자유자재로 사용 할 수 없었다. 그 이유는 ie와 같은 구형 브라우저에서는 es6를 제대로 지원하지 않았고 사람들은 구형브라우저나 구형 윈도우 os를 그대로 사용하는 사람들이 많기에 개발하는 입장에서는 es6는 그림의 떡이였다. 그런 와중 Babel 이라는 트랜스파일러가 등장했는데 이 바벨은 es6 문법을 es5로 변환시켜 준다 . 설치 해당 프로젝트를 npm init 해주고 명령창에 다음과 같이 작성한다. 개발환경에 추가하기 위해 ..

나는 리액트를 접할때 유명한 리액트 블로거인 벨로퍼트님의 책을 보면서 create-react-app 을 사용해서 손 쉽게 리액트 개발환경을 구축하는 것을 먼저 배웠다. 리액트 책을 볼 때 웹팩에 대해서 일정부분 설명이 있었으나 곧 이어 sass와 css_module을 사용을 하며 나에게는 웹팩은 sass와 css_module을 사용할때 만 건들고 더 이상은 건들지 않아도 되겠다는 개념으로 자리잡게 되었다. 그러나 오늘 채용공고에서 웹팩과 바벨의 이해가 있는 사람을 우대하는 것을 보고 집에가는 길에 웹팩에 관한 글을 읽게 되었다. 내용은 결국 여러 모듈화된 파일들을 하나의 번들파일로 만들어 이를 배포하게 해주는 것이였는데 중요한점은 "javascript외 다른 지원 파일들을 import 했을 때 사용하는 ..

선형큐는 enque로 인하여 rear가 max_size 까지 갔다면 공간이 배열에 빈공간이 있더라도 front와 rear를 초기해주지 않는 이상 enqueue를 할 수 없다. 그런 단점을 극복한 것이 원형큐이다. 원형큐는 선형큐와 달리 원형의 모양을 하고 있으며 이 queue의 공간에 아이템이 꽉 차지 않는 이상 언제든 enque와 deque를 할 수 있다. 원형큐 설명 원형 큐는 enque와 deque의 형태가 조금 다른데 그 이유는 max_size 까지 가면 front와 rear가 0 부터 다시 처음부터 시작해야 하기 때문이다. 또한 front는 항상 item이 있는 곳 앞에 존재한다. 원형큐의 멤버변수 constructor(size){ this.maxQueueSize = size; this.arra..

재귀 함수란 영어로 reclusive function 이라고도 불리운다. 이 재귀함수는 함수를 정의할때 함수내부에서 자신을 호출하는 함수, 알고리즘입니다. 재귀 함수의 사용 function reclusive(numb){ if(numb == 0){ console.log("end"); }else{ console.log(numb); reclusive(numb-1); } } reclusive(10); 파라메터로 들어온 인자를 0이 될때 까지 1씩 감소시켜 출력하는 함수를 만들었다. 재귀 함수는 함수내부에서 자신을 호출하기 때문에 별다른 제어장치가 없다면 무한 루프에 빠지기 쉽다. 그러므로 항상 제어문을 통해 재귀함수호출을 통제해야 한다. 왜 재귀 함수를 사용하는가 ? for 문이나 while문을 사용해서도 위와..