본문 바로가기

Javascript

Dictionary Data Structure Dictionaries ? 데이터를 Key 와 Value 쌍으로 저장하는 자료구조 ADT (Abstract Data Type) Method Name contents add(key, value) 데이터 추가 remove(key) 데이터 삭제 has(key) 존재 여부 get(key) 데이터 호출 clear() 초기화 size() 크기 keys() 키값들 values() 데이터 값들 구현 //ES6 class Dictionary { constructor() { this.store = [] } append(key, value) { this.store[key] = value } get(key) { return this.has(key) ? this.store[key] : undefined } remove(key).. 더보기
HashTable Data Structure About HashTable 데이터를 단시간에 삽입하거나 저장된 데이터를 가져올 때 주로 사용하는 기법이다. Hash Table 이라는 자료 구조를 이용한다. 최대값이나 최소값 같은 전체를 탐색하는 방식에 조회에는 효율이 떨어진다. 해시함수를 통해 생성된 벨류값 이 같을때 이를 collision (충돌) 이라 한다. Collision 핸들링 기법 open-addressing (개방주소 = 선형조사) separate chaining (분리된 체인) 해싱 알고리즘의 핵심은 해싱을 생성하는 해시 생성 함수에 담겨져 있다. 해시생성 함수는 문자열을 입력받아 charCodeAt() 을 통해 넘어온 문자열을 ASCII 값으로 전환하고 여기에 상수값 37을 곱하여 누적합을 구한뒤 문자열 길이로 나머지를 구한다. 책에.. 더보기
List Data Structure 자바 스크립트에서 리스트는 Array에 있는 프로퍼티를 기준으로 구현이 가능하다. 리스트 클래스를 생성하기에 앞서 개념적인 부분을 정리하고자 한다 ADT란 무엇일까? Abstrat Data Type 추상적 자료형(Abstract Data Type, 줄여서 ADT)은 컴퓨터 과학에서 자료들과 그 자료들에 대한 연산들을 명기한 것이다. 추상적 자료형은 구현 방법을 명시하고 있지 않다는 점에서 자료 구조와 다르다. 비슷한 개념의 추상적 자료 구조는 각 연산의 시간 복잡도를 명기하고 있지만 추상적 자료형에서는 이것조차 명기하지 않는다. -위키백과 자료에 대한 연산은 질의를 던지는것과 자료를 변경하기 위한 연산으로 나뉜다. 1.질의를 던지는것 pos() 현재 위치 length() 리스트의 요소 수 반환 toStr.. 더보기
Array essential with ES6 -2- 포스팅이 늦었습니다. 그간 실제 저희 스터디에 진도는 스택까지 나갔습니다. 기존에 알고리즘에 대한 지식이 있는 분들로 구성이 되어 있기때문에 이책의 부족함을 곳곳에서 찾아낼수 있었고 연습문제에서는 실제 원서1와 그 의미가 다른 문제들 그리고 원서엔 나와있지만 번역서엔 나와있지 않은 추가 문제들에 대해서 스터디장이 다시 번역을 해서 올려놓고, 그것을 풀어 나가는 식으로 진행 하고 있습니다. 연습문제 를 풀고 서로의 코드리뷰 안에서 배워나갈점이 있고 새로운것들이 도출되어 스터디에 의미는 있지만 이책은 어느 해외 독자가 남긴 리뷰 대로 기초가 없다면 한번쯤은 볼만 합니다. 하지만, 기준으로 삼기엔 부족한감이 있습니다. 그래서 책과 다른 내용들이 존재할수 있는데 , 이부분은 제가 생각했거나 혹은 스터디에서 나온.. 더보기
Array essential with ES6 -1- 소스코드 중간중간에 ES6 문법이 적용되어 있습니다. 예제코드를 실행한 브라우져 환경은 크롬 카나리 입니다.. ES6문법에 대한 설명이 생략된것은 포스팅에 포커스가 스터디에 맞춰져 있기때문입니다. 배열의 생성자 var arr1 = []; var arr2 = new Array(); // [] var arr3 = Array(); //new 연산자 생략가능 var arr4 = new Array(10); //[undefined,undefined,...] 길이가 10인배열 var arr5 = [1,2,3]; //[1,2,3] var arr6 = new Array(2,3); // [2,3] /*생성자 예외*/ var arr1 = [1,2,] // IE8 : [1,2,undefined] other : [1,2] va.. 더보기
Data Structures & Algorithms with JavaScript O'REILLY 에서 나온 책으로 간단한 스터디를 진행하고자 합니다. 초기 발단은 ,리액트 스터디에서 한분이 의견을 주셨고 저도 거기에 적극 동참해서, 기존 스터디의 서브 스터디로 진행하게 되었는데 자바로 입문할당시 면접을 준비하면서, 자료구조나 알고리즘을 공부했지만 현재 자바스크립트를 주력언어로 쓰는만큼 자바스크립트로 된 자료구조를 한번쯤 공부해야된다는 막연한 생각이 있었습니다. 그래서 이번기회에 이책을 기준으로 스터디를 진행하게 된것이고 디자인 패턴은 진행할지 모르겠지만, 순차적으로 디자인패턴에대해서도 개별 공부할 계획에 있습니다. 책의 서평을 보니 오역이랑 예제에 대한 검증이 되어있지않다는 이야기가 있지만, 기본적으로 자바에대한 알고리즘 지식이 있기 때문에 진행하는데 있어 큰문제는 없어 보입니다. .. 더보기
.attr() vs .prop() 비교 - 셀렉트박스,라디오박스 $("input:radio[name='test_name'][value='type2']").attr('checked',true); $("input:radio[name='test_name'][value='type2']").prop('checked',true); 필자는 Jquery에서 attr 을 많이 사용 합니다. 라디오 박스를 제어하는데 있어서 attr속성을 이용하는데 최초 한번에 동작만 실행되고 라디오 박스에 대한 액션이 실행되지않았습니다. prop로 해결하게 되었는데, 원인에 대한 궁금증을 해소하고자 구글링을 해봤습니다. 참고 .attr() vs .prop() 우선, 취급하는 정보가 다릅니다. attr() 은 HTML 의 Attribute 를 , prop() 는 JavaScript 의 Property .. 더보기
$.extend() 를 이용한 배열안에 있는 객체 깊은복사 Node 를 이용한 개발환경에서 서버 사이드단에 데이터를 가져오다 보면 배열 복사를 해야할때가 빈번하다. 간단한 예제로 배열 복사에 대해서 이야기 하고자 한다. arr2 =arr1 을 통해 얕은 복사가 이루어지게 되고 arr2 는 arr1 을 참조 하게된다. 이경우 arr2 에 있는 객체가 arr1 에 있는 객체를 참조하고있기때문에 다음과 같이 arr2 객체의 value 값을 바꾸게 되면 arr1 도 따라서 같이 바뀌는것을 확인해볼수있다. arr2 과 arr1 에 참조가 발생되게 하지않으려면 다음과 같이 push를 이용하는 방법이 있다. 이렇게 구현하는것은 Array 안에 들어있는것이 바로 객체이기 때문이다. 객체는 참조가된다. 그래서 새로 객체명을 정의하고 그안에 벨류값을 꺼내와서 넣었다. If 를 하.. 더보기

티스토리툴바