본문 바로가기
반응형

전체 글76

[자료구조] Stack & Queue Stack Stack은 자료를 차례대로 넣고(push)꺼낼 때는 가장 마지막에 쌓여진 자료부터 빼낸다. 배열에서의 array.psuch()와 array.pop() 메소드와 동일하다. -> LIFO(Last In Last Out) 필요 변수 및 메소드 someInstance (object) : 구현할 stack method를 담을 객체 storage (object) : 배열을 흉내내기 위한 객체 count (number) : 마지막 Index 를 return 할 변수 push() (method ): 데이터를 넣음 pop() (method) : 데이터를 뺌 size() (method) : 현재 존재하는 자료의 갯수를 return 함 Sudo Code //functional 의 방법으로 작성 let Stack.. 2019. 11. 15.
[JS] OOP(Objcet Oriented Programming) 컴퓨터 프로그램 : 알고리즘의 모음! 프로그램 언어 : 프로그램을 개발할수 있도록 도와주는 tool Machine Languages : 1과 0의 조합 Assembly Languages : CPU를 통해서 기계어로 변환됨 제약 多 High-Level Languages : (고급언어) 영어랑 비슷함, line-by-line으로 실행된다. HL언어는 두가지로 볼 수 있었다. Procedural languages - 절차지향 언어 : 어떤 절차로 진행될것인가? c언어가 대표적 Object - Oriented languages(OOP) - 객체지향 언어 : Programmers code using 'blueprints' of data models called class :Java, C++, Phython, PH.. 2019. 11. 14.
[Git] pair programming work flow 페어프로그래밍을 위한 git work flow 사용할 repository를 pair와 나 모두 fork한다. 복사해온 repository를 각자의 local에 clone한다. $git clone 페어의 repo와 나의 repo를 연결하는 작업을 한다.(둘 모두가 해당) $git remote add pair $git remote -v 코드를 작성하고 commit한다. $git add $git commit -m 'change' 작업한 코드를 자신의 git hub repository에 push한다. $git push origin master (or other branch name) 변경된 코드를 가져온다 $git pull pair master (or other branch name) 2019. 11. 11.
[JS] Symbol : ES6 type MDN poiemaweb ES6 In Depth: 심볼 (Symbol) JS는 6개의 타입을 가지고 있었다. 원시타입(primitive data type) Boolean null undefined Number String 객체 타입(Object type Object 심볼(symbol)은 ES6에서 7번째 타입으로 변경 불가능한 원시 타입 값이다. Sumbol()로 반환되는 모든 심볼값은 고유하다. 심볼은 주로 이름의 충돌 위험이 없는 유일한 객체의 프로퍼티 키를 만들기 위해 사용한다. console.log(Symbole('foo') === Symbole('foo')); // false; console.log(Symbol() === Symbol()); // false; console.log(typeof S.. 2019. 11. 4.
[CSS Rendering] CSSOM & Vendor Prefix1 CSS Rendering - 3_Box Model & Absolute Position CSS는 브라우저마다 지원 사양이 매번 다르다. 따라서 그것에 대해 vendor prefix 가 붙는 것이 대부분이다. 새로운 기능들은 vendor prefix 가 붙었다가, 안정화, 표준화가 이루어지면 vendor prefix 를 떼는 식으로 진행되는것이 관행이라 vendor perfix 처리가 까다롭다. ex) border-radius 에 vendor prefix 를 붙일 시 작동하지 않는다. CSSOM이 무엇일까? 이에대해서 깊이 이해하고자 한다면 브라우저 랜더링(정독)에 대한 이해가 반드시 따라야 할것같다. DOM(Document(HTML) Object Model) - HTML을 객체화시키어 프로그래밍 가능하게 .. 2019. 11. 3.
[JS] 2-2_reduce,_pipe,_go 함수형 프로그래밍 - 2-1_함수형으로 전환하기 reduce 만들기 function _reduce(list, iter, memo){ _each(list, function(val){ memo = iter(memo, val); }); return memo; } console.log(_reduce([1, 2, 3], add, 0)); memo(초기값) 이 설정이 되어있지 않는경우 //array like Object를 위한 함수 만들기 var slice = Araay.prototype.slice; function _rest(list, num){ return slice.call(list, num || 1 ); } function _reduce(list, iter, memo){ if( arguments.length.. 2019. 11. 1.
[JS] 함수형 프로그래밍 - 2-1_함수형으로 전환하기 함수형 프로그래밍 - 1_개요 함수형 프로그래밍의 예시 //명령형 코드 var temp_user = []; for(var i = 0 ; i = 30){ temp_user.push(user[i]); } } 위와같은 명령형 코드가 반복될 때, 함수형 코드로 전환할 수 있다. 중복을 줄이고 코드재활용도를 간단히 높일 수 있다. //2._filter, _map으로 리펙토링 // 함수형 프로그램에서 추상화의 단위는 객체나 메서드나 클래스가 아닌, '함수'의 단위이다. function _filter(list, predi){//predi는 함수임 var new_list = []; for( var i = 0 ; i < list.length ; i++).. 2019. 10. 30.
JS시계 API - flip clock을 이용한 출퇴근 관리 이 글은 앞서 종료된 프로젝트의 사용 API와 코드 정리글입니다. :-D 프로젝트 구현이 끝나가고 간단한 시계가 필요하던 차에 유투브 Online tutorials 채널에서 flip clock api를 보게되었다.단순한 시계는 굳이 이것을 사용하지 않고 javascript 만으로도 구현이 가능하고, 구글에 오픈되어있는 소스도 많지만 flip clock 은 시계 뿐만아니라 타이머, 달력 등등으로도 조정할수 있고, 디자인 역시 (이미)완성형이므로 이를 활용게되었다. ( 하지만 이는 동시에 크게 수정이 불가능하다는 뜻이기도 하다! 색상외에 상세한 UI를 변경하려 하는 즉시 배치가 깨지기 시작한다..ㅠ) - 화면의 우측 상단의 시간 카운팅 flip clock 가장 기본적인(현재 날짜로서의) 활용법은 Online.. 2019. 10. 29.
[CSS Rendering] Box Model & Absolute Position CSS Rendering - 2_고전 레이아웃 코드스피츠 유투브 강의 (고전)Box Model - 하나의 element 는 4단계의 box를 갖고있다. margin은 무조건 투명하며, 아직까지 색깔을 넣을 수 있는 기능은 없다. 투명하지만 실체를 확보하고 있는 공간이다. Border 도 외곽'선'이지만, 끝없는 영역 차지가 가능하기 때문에 하나의 property라고 볼 수 있다. 현재 Draft 중 border background 또한 줄 수 있기도 하다. Padding은 Border 과 Contents를 띄워주는 역할을 한다. Box-sizing - 박스 사이즈를 여러가지 관점에서 볼 수 있다. 기본값 : Contents-Box를 기준으로 되어있다. 하지만 padding-box(파이어폭스에서만 지원)나.. 2019. 10. 29.
728x90
반응형

티스토리툴바