Javascript/Javascript(ES6) (16) 썸네일형 리스트형 ES6 이진 탐색 트리 구현하기, 어떻게 특정 값을 빠르게 찾을 수 있을까? (Binary Search Tree, BST) 이진 탐색 트리 (Binary Search Tree with ES6) 트리 구조에 대해서는 많이 들어보았다고 생각한다.어렵게 생각할 것도 아닌 그냥 루트(root)노드에서 하위 노드로 계층 구조를 갖는 것을 트리라고 보면된다.윈도우 파일시스템 구조처럼 C드라이브 하위에 windows디렉토리, program files디렉토리 등이 있고 program files디렉토리 하위에 Java디렉토리가 있는 등 이런 구성이 트리다.각설하고. 프로그래밍에서 노드 2개 이하로 제한하는 방식을 이용해 이진 탐색 트리(BST)라는 것을 만들었다.노드가 2개이하라는 특징 덕분에 프로그래밍에서 특정 값 검색을 빠르게 할 수 있게 되었다.이진 탐색 트리는 루트 노트를 기준으로 루트 노트보다 작은 값은 왼쪽 하위노드로, 루트 노트.. ES6 프로미스(Promise), 진짜 쉽게 이해하기 (Promise의 목적만 생각한다.) 프로미스(Promise) 싱글쓰레드인 자바스크립트에서 비동기 처리를 위해서 콜백(callback)을 사용해왔다.덕분에 비동기 처리를 온전히 해낼 수 있었지만 이런 콜백이 사용되는 경우가 많아지면서 단점이 드러났다.그 단점은 비동기 처리를 순차적으로 실행할 필요가 있는 경우에 비동기 처리를 중첩시켜서 표현하므로 에러, 예외처리가 어렵다는 것과 중첩으로 인한 복잡도가 증가하는 것이 이다.크게 이 두 가지의 단점을 해결하기위해 프로미스가 예전부터 라이브러리로 생겨났고, 이것을 ES6에서는 언어적 차원에서 지원하게 되었다.Promise를 이해하기 위해 여러 블로그를 돌아다니며 찾아본 결과 핵심은 이 프로미스의 목적만 머릿속에 집어넣는 것이고, 딱 한 번만 따라 쳐보면 이해가 된다."비동기에서 성공과 실패를 분리.. ES6 바벨(babel)을 이용한 트랜스 파일링(es6 개발환경 구축하는 방법, feat.webpack) Babel (바벨 : 트랜스파일링) Babel(바벨)은 ES6문법으로 작성된 js파일을 ES5문법으로 작성된 js파일로 만들어주는 작업을 해주는 도구다.대부분의 브라우저가 ES6문법을 완전히 지원해주지 않기 때문에 ES6문법의 자바스크립트 파일을 사용할 수 없다.따라서 Babel(바벨)을 이용해서 개발은 ES6로 하되 브라우저는 트랜스 파일링된 ES5문법의 js파일을 사용하게 하는 식의 구성을 갖게 해야한다.Babel 환경 설정 방법 바벨을 사용하기 전에 node.js의 NPM에 대해서 알아야한다. (패키지 매니저로 babel-cli등을 설치하기 위함.)1. 프로젝트 디렉토리 생성- mkdir myproject && cd myproject2. package.json 생성- npm init -y // 여기.. ES6 자료구조 연결리스트(LinkedList) 구현하기(이중연결리스트, 원형연결리스트) 그리고 의문점.. ES6로 연결리스트(LinkedList) 만들기 연결리스트라는 자료구조를 구현해본다.기존 배열은 단점이 있다. 자바스크립트에서는 아니지만 다른 언어에서 배열은 길이를 자유롭게 늘리고 줄이기 어렵고, 자바스크립트에서 배열은 객체이므로 효율이 약간 떨어질 수 있다고 한다.(왜 객체라는 이유로 효율이 떨어지는지는 찾아보았는데 잘 안나와서 찾아보는 중이다... 알고 계신분이 있다면 댓글로 도움을 주셨으면 좋겠다.)따라서 처리속도가 빠른 것을 원한다면 배열 대신 연결리스트를 사용하면 조금더 성능이 좋아질 때가 있다. 하지만 임의의 접근(index를 통한 접근)을 지원하지 않으므로 접근이 잦은 경우에는 배열을 쓰는 것이 좋다.연결리스트는 어떤 object를 갖는 Node를 담고 있고 연결이라는 단어 그대로 next.. ES6 자료구조 큐(Queue) 구현하기, 우선순위 큐 만들고, 큐 두개로 스택 만들기 큐(Queue)구현하기 큐는 선입선출(FIFO) 자료구조다. 배열을 기반으로 큐를 구현했다.포인트는 배열이라서 shift()메서드와 push()메서드가 있어서 구현이 훨씬 편리하다는 것이다.1234567891011121314151617181920212223242526272829303132333435363738394041class Queue{ constructor(){ this.dataStore= []; } toString(){ let result = ""; for(val of this.dataStore){ result = result + val + "\n"; } return result; } enqueue(element){ this.dataStore.push(element); } dequeue(){ re.. ES6 자료구조 스택(Stack)만들어보기, 스택 2개로 큐(Queue) 만드는 방법 ES6 Stack 만들기 스택(Stack)은 리스트구조에서 한쪽 방향에서만 입력, 출력이 되는 구조다.LIFO(Last in First Out)으로 가장 나중에 넣은 자료가 가장 처음 나오는 자료 구조로 프로그래밍중에 종종 사용된다.자료구조에 대한 이해는 어느정도 되어있다고 가정하고 javascript에서 구현을 해본다.12345678910111213141516171819202122232425262728293031323334353637class Stack{ constructor(){ this.top = -1; this.dataStore = []; } push(element){ this.top++; this.dataStore[this.top] = element; } pop(){ if(this.top>-1).. ES6 javascript로 자료구조 List 구현하기 (배웠으면 사용해보자!!) DataStructures and Algorithms with javascript 책 "자바스크립트 자료구조와 알고리즘"을 보고 리스트 구현을 ES6로 해보는 연습이다.책에서는 ES5 문법이므로 보고 ES6로 바꾸는 과정이 있다.[전체 코드]12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697//ES6 List 클래스 만들기class List{ constructor(){ this.listSize = 0; this.pos = 0; .. ES6 자바스크립트 모듈 사용하기 (import, export) ES6 모듈 만들고 사용하기 자바스크립트에는 지금까지 C(#include)나 JAVA(import)의 모듈시스템이 활성화되지 않았을까?자바스크립트는 호이스팅이 되는 관계로 변수나 함수가 전역에서 사용할 수 있었기 때문에 이름으로 충돌을 일으키는 경우가 많아서 이용하기 어려웠다. (CommonJS로 사용할 수는 있었음)ES6부터는 모듈 시스템을 사용할 수 있게 만들었다.하지만 브라우저에서 지원이 되지 않고있기때문에 webpack같은 모듈 번들러를 사용해야만 모듈시스템(import, export)을 사용할 수 있다.export, import 1234567891011export const pi = Math.PI; export function square(x) { return x * x;} export clas.. 이전 1 2 다음
