FRONTEND/JavaScript 30

재귀...(recursion) with 순열, 조합 알고리즘 구하기

재귀란...? 사실 재귀의 사전적 의미자체를 모르는 사람은 없을 것이다. 단지 적용이 어려울뿐... 오늘은 그래서 내가 뭔가 a-ha! moment가 왔던 부분에 대해 정리를 해보고자 한다. 그래서 도대체 뭘 깨달았냐고 ? 지금 와서 돌아보면 당연한 거지만, 몇시간 전만 해도 이해가 도저히 안되던 부분이라 정리를 해보고자 한다. 우선, 중복되는 순열을 구하는 법에대해 이해했다. 사실, 이전 블로그 글에 순열과 조합을 구하는 방법에 대해 정리를 하기는 했었다. 하지만 이번에 학습을 하면서 약간, 내 기준으로는 많은 발전이 있어 다시 정리를 한다. 그래서 뭐를 깨달았다는건데 ??? 사실 예전에는 재귀를 사용할때, 위와 같이 aux(input, temp.concat('sth'), count+-1) 이라는 방식..

FRONTEND/JavaScript 2021.07.21

재귀적으로, while문으로 dfs구현하기 (feat. 재귀함수 undefined)

기초가 부족한 탓인지, 요즘 알고리즘, 재귀가 갑자기 더 어렵다고 느껴지기 시작한다.(원래 어려웠지만... 예전에는 당연하게 넘어갔던 것들이 지금 와서 발목을 잡기 시작한다.) 그래서 알고리즘에 자주 나오는 dfs를 구현하면서 재귀에 관련하여 정리를 해보기로 헀다. 우선, Tree구조로 우리가 탐색할 자료를 클래스를 이용하여 만들어 보기로 했다. 위의 상황에서 아래와 같은 코드를 작성하게 되면, 위와 같은 형식의 tree 구조가 만들어지게 된다. 여기까지는 큰 어려움이 없을텐데... 오늘 focus를 두고 싶은 것은, 여기에서 내가 찾고싶은 value를 가지고 있는 해당 객체를 return 하는 함수를 구현 하는 것이다. 우선, 위에서 정의한 dfsTest를 input이라는 배열에 담아 놓았고, 이 배열..

FRONTEND/JavaScript 2021.06.13

async & await

async 란? · 쉽게 Promise객체로 만드는 방법(by using async function) · promise chaining을 계속 하다 보면 가독성이 떨어지게 된다. · async & await은 promise를 동기적으로 실행되는 것 처럼 보여주는 API · 기존의 promise위에 좀 더 간편함을 추가한 syntactic sugar 왜 비동기처리는 필요한 것일까? · JS엔진에서는 {} 안에 있는 항목들을 동기적으로 실행하게 된다. · 이때 만약 {}안에 시간이 오래 걸리는 항목이 있게 되면, 문제발생! · 그러므로 이렇게 시간이 필요해 보이는 항목들은 비동기적으로 처리 ✔️ Promise?(상황극) => 내가 언제 data를 받아 올 수 있을지 모르지만, 약속하는 것! => Promis..

FRONTEND/JavaScript 2021.06.08

Stack 과 queue 자료구조에 대하여

Stack 구조란? ✔️LIFO(Last In First Out)구조를 가지는 자료구조 · 원통형의 구조에 순서대로 하나씩 쌓여져 가는 구조. · 뺄때는 위에서 부터 하나씩 뺄 수 있는 구조. · 실사용 예: 브라우저의 뒤로 가기, 앞으로 가기 기능을 구현 4... 3 2 1 Queue 구조란? ✔️FIFO(First In First Out)구조를 가지는 자료구조 · 원통형의 구조에 쌓되, 하나씩 밑으로넣어가는 구조 · 뺄때는 위에서 부터 하나씩 뺄 수 있는 구조. · 실사용 예: 브라우저의 뒤로 가기, 앞으로 가기 기능을 구현 1 2 3 4...

FRONTEND/JavaScript 2021.06.06

재귀적 구조를 짤때 주의할 점(feat. Tree 타입구현)

이번에는 바보 같지만, 내가 자주 실수 하는 부분에 있어 잊지 않기 위해 포스팅을 한다. 클래스 tree라는 것이 있고, 해당 구조는 아래와 같다고 하자. class Tree { constructor(value) { this.value = value; this.children = []; } 여기에서 value를 가지고 있는지 탐색을 할 수 있는 contains이라는 메소드를 만들고자 하면, contains(value){ if(this.value === value) return true; for(let i = 0; i< this.children.length; i++){ if(this.children[i].contains(value)) return true } return false } 로 하면 된다. 굉장..

FRONTEND/JavaScript 2021.06.06

도대체 HTTP, AJAX, XHR, XML 그리고 JSON은 무엇인가?

Q. http 란 무엇인가? A. Hyper Text Transfer Protocol의 약자. · client와 server간에 데이터를 request, resoponse하는 protocol 즉, 서버와 클라이언트가 어떻게 데이터를 주고 받을지 정한 규칙 Q. AJAX 란 무엇인가? A. · Asynchronous JavaScript And XML 의 약자. · 자바스크립트의 라이버러리 중의 하나로, 웹페이지에서 동적으로 서버와 클라이언트가 데이터를 주고 받을 수 있는 기술 · 대표적인 브라우저 API로는 XMLHttpRequest, fetch 가 존재 Q. XML 이란 무엇인가? A. eXtensible Markup Language의 약자. HTML과 마찬가지로 Markup Language의 일종. ·..

FRONTEND/JavaScript 2021.06.06

(Promise, async & await) - 콜백헬을 피해서...

앞서 우리는 비동기적인 것을 제어하는 방법으로 콜백함수를 살펴 보았다. 하지만, 이렇게 작성할경우, 코드의 이해가 매우 힘들어 질수 있다는 단점이 있었다. 이러한 콜백헬을 극복하기 위해서 나타난 개념이 바로 Promise이다. Promise var Promise: PromiseConstructor new (executor: (resolve: (value: any) => void, reject: (reason?: any) => void) => void) => Promise ✔️ 위에서 볼 수 있듯이, Promise는 첫번째 인자로 executor함수를 받게 된다. ✔️ JavaScript에 내장되어 있는 object ☑️ "성공한 상태(State)" 인지, "실패한 상태(State)" 에 대한 이해가 필요..

FRONTEND/JavaScript 2021.05.31