본문 바로가기
반응형

전체 글123

Queue 큐 / Stack 스택 Queue 큐 큐는 일상생활에서 줄서기를 할 때와 동일한 형태로 동작하는 자료구조다. 먼저 줄을 서있던 사람이 먼저 줄에서 이탈한다. 큐도 마찬가지로 먼저 입력된 데이터가 먼저 제거된다. 시간복잡도 자료구조 조회 삽입 삭제 Queue O(n) O(1) O(1) Stack 스택 스택은 쌓여있는 접시를 사용할 때와 같은 구조다. 추가와 삭제는 스택의 최 상위에서만 수행할 수 있다. 가장 먼저 입력된 데이터가 가장 먼저 이탈한다. 시간복잡도 자료구조 조회 삽입 삭제 Stack O(n) O(1) O(1) 2020. 10. 26.
npm package.json NPM NPM은 Node Package Manager로 필요한 모듈을 다운로드할 수 있는, 모듈들이 모여있는 모듈 스토어다. 앞으로 필요한 모듈은 대부분 NPM에서 다운로드해서 사용한다. node 모듈을 사용하는 프로젝트에서 npm이라는 키워드는 하나의 명령어처럼 사용된다. npm start처럼, 프로젝트를 실행시킬 때 npm 키워드를 사용하기도 한다. package.json 프로젝트에 대해 필요한 모듈이 무엇인지 알려주는 역할을 하는 것이 바로 *_package.json *_이다. package.json에는 이 프로그램을 실행시키기 위해 필요한 모듈들이 무엇인지, 프로그램을 실행시키는 방법, 프로그램을 테스트하는 방법 등이 명시되어 있다. 프로그램을 실행시키기 위해 필요한 실제 모듈은 node_modu.. 2020. 10. 25.
this call() apply() bind() this 패턴바인딩되는 객체 (브라우저)바인딩되는 객체 (node.js)Globalwindow (strict mode - undefined)module.exportsFunction 호출window (strict mode - undefined)global 화살표함수의 this const foo = () => { return this } foo() === module.exports //true 메서드 안에서 this를 호출하면 global이 바인딩되는 것이 맞지만, 화살표 함수 내에서 this를 호출하면 메서드 내부에서 호출한 것이 아닌 해당 함수가 선언된 위치를 기준으로 this 가 바인딩 되게 된다. (*좋은 설명 있으면 추가할 것.) call() call은 항상 함수를 "실행"한다. 첫 번째 인자가 항.. 2020. 10. 20.
shorthand syntax / 객체분해 / rest spread syntax 예시 const name = 'gildong' const age = 19 const human = { name, age, level: 'Junior' } console.log(human) // { name: 'gildong', age: 19, level: 'Junior' } 객체에 변수 명을 key로 변수 값을 value로 할당할 수 있다. 객체분해 cosnt student = {name: 'gildong', major: 'computerScience'} const { name } = student { name } === { name: 'gildong' } //true 객체의 특정 키값만 따로 임의의 객체에 저장할 수 있다. rest / spread syntax 이용 const student = { name:.. 2020. 10. 20.
구조 분해 할당 (Destructing Assignment) 2020. 10. 20.
Git 명령어 git checkout 브랜치명 브랜치명으로 이동 git checkout 브랜치명 -b 브랜치명을 생성하고 이동 git commit --no-verify -m 'blabla' 유효성검사 하지 않고 커밋 2020. 10. 19.
Ubuntu CLI 명령어 sudo apt-get update sudo apt-get upgrade .deb 파일설치 sudo dpkg -i 패키지.deb 조회 ls 파일 리스트 ls -al 파일 (속성) 리스트 code . 현재 위치를 VS code에서 열기 이동 (수정) cd . 현재 디렉토리(= . )로 이동 cd .. 상위 디렉토리로 이동 cd ~ 홈 디렉토리로 이동 cd / 최상위(루트) 디렉토리로 이동 cd - 이전 위치(경로)로 이동 (= 뒤로가기) pwd 현재 디렉토리 경로 확인 (print working directory) mv 파일명(폴더명) 경로 파일(폴더)을 경로로 이동 mv 파일명(폴더명) 새로운이름 파일(폴더)명 변경 chown woner:group file 파일 소유권 변경 chmod? 생성 touch .. 2020. 10. 19.
버블링(bubbling) vs 캡처링(capturing) eventListener() vs onclick()를 이해하기 위해 간단히 개념만 설명했다. 자세한 설명은 하단 출처 참고. 버블링 한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작한다. 가장 최상단의 조상 요소를 만날 때까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작한다. 3개의 요소 ( form > div > p )가 있다 form 안에 div 안에 p요소가 있는 형태. 직접 확인 : plnkr.co/plunk/FDfhm3tzwTz3B6Fb 가장 안쪽의 p요소를 클릭하면 다음과 같은 실행과정이 발생한다. 에 할당된onclick핸들러가 동작. 바깥의 에 할당된 핸들러가 동작. 그 바깥의에 할당된 핸들러가 동작. document객체(최상위 .. 2020. 10. 16.
addEventListener() vs onclick() 사용법 document.getElementById('trigger').addEventListener('click',()=>{ alert('hello!'); },false); document.getElementById('trigger').onclick = () => { alert('hello!'); } addEventListener()를 사용하는 방법이 모던하다는 이유 1. 여러 개의 메서드를 동시에 등록할 수 있다. do1 함수는 바로 아랫줄에서 do2 함수로 덮어 씌워졌기 때문에 동작하지 않는다. 반면, 한 클릭이 일어났을 때 여러가지 일이 동작하게 하고 싶고, 함수가 분리되어 있다면 addEventListener로 작성하는 것이 .. 2020. 10. 16.
반응형

티스토리툴바