Dog foot print

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 해주고 명령창에 다음과 같이 작성한다. 개발환경에 추가하기 위해 ..

화살표 함수는 es6 2015에 등장한 함수사용법으로 function 키워드를 사용하지 않고 함수를 만들 수 있다. 그래서 그자체로는 익명함수가 되며 함수표현식을 이용하여 주로 사용한다. ex ) const arrow = ()=>{}; 화살표 함수사용 ()=>{} // 매개변수가 없는경우 x => {} // 매개변수가 한개인 경우 (x,y) =>{} //매개변수가 여럿인 경우 () => console.log("arrow"); //실행문이 한 줄인경우 () =>{ return { property : 1 } }; // 객체반환 ()=>({ property : 1 }); //객체 반환 () =>{ let myName = "hokeys"; return console.log(myName); } 화살표 함수의 렉시..

선형큐는 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..

학교에서 c언어나 c# 실기수업을 들을때 가장 신기한 것은 학생들이 지역변수나 포인터를 사용하지 않고 대부분 main 함수에서 전역변수를 이용해서 프로그래밍을 하던 것이다. 또한 내가운영하는 자스민에도 스코프의 개념이나 변수들의 유효범위에 대해서 모르는 경우가 많았기에 스코프에대해서 포스팅을 하고 다시 정리하도록 해야겠다. 스코프를 포스팅하기위해 여러 블로그를 보던 중 잘 정리되어있는 번역글이 있어 그 글을 다시정리하며 내것으로 만들어 보겠다. https://medium.com/@khwsc1/번역-자바스크립트-스코프와-클로저-javascript-scope-and-closures-8d402c976d19 [번역] 자바스크립트 스코프와 클로저(JavaScript Scope and Closures) 본 글은 J..

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

제이쿼리를 사용하면 toggleclass 나 addClass , removeClass 등 스타일링을 간단하게 변환할 수 있지만 바닐라 js에서는 document객체 를 이용해 className을 스트링으로 제어해야 한다. 해당 헤드에 대한 html 과 css 정보는 https://hokeydokey.tistory.com/33 이 링크에서 받을 수 있다. span 추가하기 jasmin 이 div안에 있는데 우리가 기대하는건 logo를 클릭했을때 컬러의 색상이 변경해야 함으로 logo를 span으로 감싸준다. 로직 구상 하기 span 태그를 건들면 해당 로고의 색상이 변경되어야 한다. 그럼 우리가 필요한 것들은 document.getElementById()로 해당 요소를 가져온다음 onclick 이벤트로 해..