Web Front End/Javascript & Typescript

[러닝 자바스크립트] 14장. 비동기적 프로그래밍

14장. 비동기적 프로그래밍 목차 개요 콜백 프라미스 제너레이터 1. 개요 자바스크립트: 단일 스레드로 동작함(한 번에 한 가지 일만 가능) 부드럽게 동작하는 소프트웨어를 위해 비동기적 관점에서 문제를 생각해야 함 자바스크립트 비동기적 프로그래밍의 패러다임 콜백 Promise 제너레이터 제너레이터 자체는 비동기적 프로그래밍을 지원하지 않음 비동기를 사용해야 하는 경우 Ajax 호출을 비롯한 네트워크 요청 파일을 읽고 쓰는 파일시스템 작업 의도적으로 시간 지연을 사용할 때 (알람 기능) Callback과 Promise 음식점으로 비유하기 Callback : 줄을 서서 기다리지 않도록, 자리가 나면 전화를 해주는 음식점 Promise : 자리가 났을 때 진동하는 진동벨을 넘겨주는 음식점 2. 콜백 자바스크립..

[Javascript] Event & EventListener

addEventListener("click", ()⇒{}) 이벤트 등록 표준방법 첫 번째 인자: 발생하는 이벤트 이름 두 번째 인자: 이벤트가 발생할 때 실행되는 함수 / 이벤트핸들러 / 이벤트리스너 event Type https://developer.mozilla.org/en-US/docs/Web/Events https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_handler_properties

[Javascript] Web API - Window

Window DOM 문서를 포함하는 창 현재 스크립트가 작동 중인 창을 나타내는 전역 변수 주요 메소드 Window.alert() Window.open() Window.requestAnimationFrame() Window.requestIdleCallback() EventTarget.addEventListener() GlobalEventHandlers.onclick() GlobalEventHandlers.onfocus()Referrence https://developer.mozilla.org/ko/docs/Web/API/Window

[Javascript] DOM API

document.getElementById("{id}"); 주어진 문자열과 일치하는 id 속성을 가진 요소를 찾고, 이를 나타내는 Element 객체를 반환 ID가 없는 요소에 접근하려면 Document.querySelector()를 사용 찾으려는 id가 없으면 null 반환 document.querySelector("{css selector}"); document.querySelectorAll("{css selector}"); getElementId + innerHTML Node Type elements, text, comments 처럼 서로 다른 종류의 노드를 구별하는데 사용 가능 HTML Node 탐색 text를 포함하여 탐색할 수 있음 let divEl = documenlt.querySelecto..

[Javascript] 줄바꿈 없이 console에 출력하는 방법

console.log를 한 줄에 쓰지 않으면 자동으로 줄바꿈이 된다. 이를 여러 줄에 쓰면서 한 줄에 나오게 하고 싶다면 process.stdout.writer를 쓰자 process.stdout.write();

Visual Studio Code 단축키

라인 삭제 Ctrl + Shift + K 멀티라인 주석 토글하기 Shift + Alt + A 자동 줄바꿈 사용하기 Alt + Z 수정했던 라인으로 이동하기 Alt + 좌우 방향키