souvenir

나는 미친듯이 멀티태스킹이 안되는 사람이다. 그래서 학교 다닐 때 자신이 좋아하는 노래를 들으면서 공부하는 친구들을 보면 그렇게 부럽고 대단하였다. 물론 시간이 지나 연습해보면서 어느정도의 멀티 태스킹이 가능하게 되었지만 여전히 쉽지 않다... (강제로 모든 것에 올인해야함) Why Async? 갑자기 멀티테스킹을 이야기 하는 이유는 내가 공부하고 있는 JavaScript라는 언어도 멀티태스킹이 안되는 언어이기 때문이다. call Stack에 함수를 쌓아서 stack의 순서대로 함수를 실행하는, C나 다른 언어들에 비하면 참으로 심플한 언어이다. 문제는 JS가 주로 웹에서 사용된다는 것이다. 이렇게 한번에 하나의 일만 하게 되면 어떻게 될까? 극적인 예시로 유튜브에서 영상을 보기위해 영상을 클릭했다고 하..

ES5 문법에서 객체 만들기 1. Functional var Car = function() {//Car라는 함수를 변수 선언식으로 만듭니다. 클래스 선언시는 대문자로 var someInstance = {};//반환할 객체, 즉 복제품(Instance)를 선언 someInstance.position = 0 ;//위치 속성 선언 someInstance.move = function() {//위치 이동하는 기능(method)을 함수로 선언함 this.position += 1; } return someInstance;//복제품(instance) 반환 }; var car1 = Car();//instance 만들기 및 method 실행 var car1 = Car(); car1.move(); 2. Functional ..

지난번 글에 이어 filtering 기능 구현을 하면서 겪었던 에러를 정리해보고자 한다. filtered 함수 수도 코드 username(div.divName)에 클릭 이벤트 주기 클릭 이벤트를 받은 username의 li 외에 다른 li는 지우기 가능하다면 GoBack 버튼을 만들어 filtering전의 모습으로 복구 1. username(div.divName)에 클릭 이벤트 주기 let cilck = document.querySelecor('.read-username').oncilck; cilck = filtered; //filtered()로 입력하면 클릭할 때 되는 것이 아니라 바로 함수가 실행되게 됨 click; //밖에서 한번 실행을 해주어야 적용되기 때문에 한번 더 선언해줌. 위와같이 작성했을..

DOM(Document Object Model) : HTML 요소들을 JavaScript 객체로 표현하는 문서 DOM =JavaScript 는 아니며 HTML의 트리 구조를 JS의 객체 형식으로 표현한 것. Document라는 전역변수로 접근 가능 Console.dir을 통해 HTML의 내용을 JS의 객체처럼 확인할 수 있음. 1. 활용 용도 JS를 통해 HTML 문서 중 해당 사항을 검색 혹은 수집하여 묶거나, 수정하는 것도 가능함. 아래와 같은 내용을 주로 확인함. 1) 태그이름(tagName), id(id), class 목록(classList), class 문자열(className) classList : 해당 태그의 속한 class들의 목록을 '객체 형식'으로 보여줌 Ex) $0.classList...