If...Else

자바스크립트 동작 (왜 비동기로 작동하는가?) 자바스크립트는 싱글 스레드다. 하나의 스레드로 모들 일을 해야 한다. 따라서 일을 하던 중 시간이 오래 걸리는 작업(API 통신, setTimeout 등)을 만났을 때, 이 작업을 끝까지 기다리게 되면 그동안 다른 일을 못하게 된다. 이는 굉장히 비효율적이고 느리기 때문에 자바스크립트는 비동기식으로 일을 진행한다. 즉 오래 걸리는 작업은 요청만 해놓고 그동안 다른 일을 하는 것이다. 아래 장보기 예제를 보자 (각 가게로 이동하는 시간은 0분이라고 가정) 내가 장을 보는데 다음과 같은 순서로 행동했다면 AM 11:00 떡집 도착 후 떡이 만들어지는 동안 30분 대기 후 수령 AM 11:30 야채가게 도착 후 물건 고르는데 20분 소요 장보기를 마무리했을 때 시..

아래의 명령어로 vue 프로젝트를 생성 & 실행 시 localhost:8080 URL에서 화면을 확인할 수 있다. vue init webpack project-name cd project-name npm run dev 하지만 localhost에서는 페이지에 접근이 가능하지만, IP로 접근 시에는 페이지가 열리지 않는다. (예: 12.34.56.78:8080) webpack-dev-server에 IP에 대한 제한 설정을 풀어주면 IP로도 페이지 접근이 가능해진다. package.json 파일 내 scripts.dev 부분에 "--host 0.0.0.0 --disableHostCheck true" 구문을 추가한다. as-is "scripts": { "dev": "webpack-dev-server --inli..

react native 환경설정 가이드대로 모두 세팅했지만, 안드로이드 디바이스에 빌드 시 에러가 발생했다. $ react-native run-android info JS server already running. info Building and installing the app on the device (cd android && ./gradlew app:installDebug)... error Could not install the app on the device, read the error above for details. Make sure you have an Android emulator running or a device connected and have set up your Android de..

1) canvas 태그에 이미지 그리기 drawImage() 메소드를 사용하여 이미지를 그린다. const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); const image = document.getElementById('source'); ctx.drawImage(image, 0, 0); 2) base64 문자열로 변환 canvas에 그린 이미지를 toDataURL() 메서드를 활용하여 base64 문자열로 받을 수 있다. console.log(canvas.toDataURL()); console.log 결과 data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoC..

CSS 애니메이션 구동 시 자바스크립트에서 시작 종료 시점을 알 수 있다. html css div { width: 100px; height: 100px; background: red; position: relative; animation: mymove 2s linear forwards; animation-delay: 1s; } @keyframes mymove { from { top: 0px; } to { top: 100px; } } javascript var ani = document.querySelector(".ani"); ani.addEventListener("animationstart", function(e) { console.log("시작"); }, false); ani.addEventListen..