queue(큐) 선입선출(FIFO, First In First Out), 먼저 들어간 데이터가 먼저 나온다 보통 사용자 입력에 대해서 저장, 관리. 레스토랑 앱, 예매 앱 등등 주요한 자료구조로 사용 Callback Queue 한쪽으로 데이터를 넣고 다른 쪽으로 데이터를 가져오는 구조. 데이터를 추가한 순서대로 데이터가 저장되고, 추가한 순서대로 데이터를 가져오게 된다 추가적으로 데이터를 넣는 쪽을 rear, 데이터를 가져오는 쪽을 front 데이터를 삽입하는 행위를 Eequeue, 데이터를 가져오는 것을 Dequeue class Node { constructor(data) { this.data = data; } } class QueueNode extends Node { constructor(data) ..

Stack(스택) 선입후출(LIFO, Last In First Out), 먼저 들어간 게 나중에 나중에 브라우저 History(이전,다음 페이지) 또는 Ctrl+z로 이전작업을 취소하는 등의 동작에 쓰이는 자료구조 Call stack JS 코드가 실행되며 생성되는 실행 콘텍스트(Execution Context)를 저장하는 자료구조 함수를 호출하면 실행 컨텍스트가 생성되며, 이를 Call stack에 추가한 다음 함수를 수행 함수에 의해 호출되는 모든 함수(내부 함수들)는 Call stack에 추가되고 해당 위치에서 실행 함수의 실행이 종료되면 해당 실행 콘텍스트를 Call stack에서 제거한 후 중단 된 시점부터 다시 시작 만약 스택이 할당된 공간보다 많은 공간을 차지 하면 Stack Overflow ..

자료구조 (Data Structure) 한정된 용량(메모리, 공간)에 최적화시켜서 많은 데이터를 쓸 수 있도록 설계된 것 데이터에 편리하게 접근하고 변경하기 위해 데이터를 저장하거나 조직하는 방법 단순 구조 (Primitive Data Structure) 프로그래밍에서 사용되는 기본 데이터 타입 (string, number, boolean, null, undefined 등등) 비단순 구조 (Non-Primitive Data Structure) 여러 데이터를 목적에 맞게 효과적으로 저장하는 자료 구조 (Object, Array, function 등) 선형 구조 (Linear Data Structure) 저장된 자료의 전후 관계가 1:1 인 경우 비선형 구조 (Non-Linear Data Structure)..

Class 코드의 중복성을 줄이면서 객체를 생성하는 틀, template prototype 기반의 언어인 JS에서도 직관적으로 쉽게 코드를 읽고 만들어주고 이전의 class 기반으로 개발했었던 개발자들도 쉽게 적응할 수 있도록 하기 위해 사용 class Block { constructor(_count) { this.count = _count; } consoleLog() { console.log("Block 의 " + this.count + "번째 입니다."); } } const block = new Block(1); block.consoleLog(); console.log(block); class Block{} : Block이라는 이름의 클래스를 선언 constructor(_count ){} : _cou..

Elements DOM(document)내에서는 정의된 Tag의 내용 document.getElementById(’name’) —> name을 id선택자로 설정된 element를 가져온다. Tag와 element의 차이는 Tag는 태그의 이름 그 자체이고, Element는 객체다. HTML 파일에서 Tag(여는 태그와 닫는 태그 및 자식들 까지 모두 포함)에 사용된 내용들을 모두 포함한 것이 Element이다. Tags HTML에서의 요소들의 이름을 뜻 , solo parent child1 child2 child3 console.log(document.body.children); console.log(document.body.childNodes); console.log(document.getElement..

querySelector JS에서 HTML 요소(엘리먼트)들을 가져올 때 사용한다 CSS 선택자들(ID, Class, HTML Tag 등등)로 찾아서 해당하는 요소(엘리먼트)를 반환해준다. querySelector() : CSS선택자로 해당하는 첫 번째 HTML요소를 1개 반환해준다. 중복된 class선택자로 querySelector를 사용할 겨우 제일 최상단에 하나만 선택하여 반환한다 특정 name, id, class를 제한하지 않고 css선택자를 사용하여 요소를 찾는다. 만일 같은 class 선택자라면 스크립트의 최상단 요소만 로직에 포함하여 가져 온다. querySelectorAll() : CSS 선택자에 해당하는 요소들 전부를 가져와서 반환해준다 querySelector와 사용방법은 동일하며 선택..