반응형 javascript5 [자바스크립트] moveTo() lineTo()란? 사각형, 삼각형, 집 그리기 / 바닐라JS 그림 앱 만들기 / #1.3 #1.4 ctx.rect()도 shorcut function 이었다. rect보다 더 기본적인 기능인 moveTo와 lineTo를 활용해서 사각형을 그릴 수 있다. 그림판으로 그림을 만들려면 가장 작은 단위의 함수를 사용해야한다. moveTo(x, y): 브러쉬를 단순 이동 시켜준다. lineTo(x, y): 선을 그으며 이동한다. *다만 stroke()나 fill()을 사용해야만 선이 나타나거나 윤곽이 보인다. html과 css 코드는 이전 글과 같다. 아래 링크참조. 2022.11.02 - [IT/javascript] - [javascript] 바닐라JS로 그림 앱 만들기 #1.2 Paths / canvas에서 사각형 그리는 순서 [javascript] 바닐라JS로 그림 앱 만들기 #1.2 Paths / ca.. 2022. 11. 3. 자바스크립트로 크리스마스 디데이 계산기 / Date, setInterval, Math.floor 함수 작업포인트 ( 사용된 내장 함수 ) new Date Date 타입의 새로운 객체를 생성. 인수를 생략하면 현재 날짜 및 시간을 나타내는 객체가 생성되고 인수를 전달하면 인수에 따라 Date 객체가 생성된다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/Date setInterval(사용할 함수명, 실행 간격) 2개의 인수를 받는다. 하나는 실행할 함수와 실행 간격. 간격은 밀리초로 입력한다. 1초는 1000으로 표기한다. https://developer.mozilla.org/en-US/docs/Web/API/setInterval Math.floor() 내림함수 : 받은 숫자와 같거나 작은 정수의 .. 2022. 5. 23. #6 [2021 UPDATE] QUOTES AND BACKGROUND #6.0 Quotes 명언과 작가 랜덤하게 표출시키기 Math.random()과 Math.floor() 배열A[Math.floor(Math.random() * 배열A.length)]; Math.random() 0~1 사이의 랜덤 숫자를 제공하는 자바스크립트 함수 Math.round() 반올림 함수 Math.ceil() 올림 함수 Math.floor() 내림 함수 배열 길이 알려줌 .lenth const quotes = [ { quote: "abcdefg", author: "a" }, { quote: "hahahahahahahahaha", author: "banana" }, { quote: "hi!!!!!!!!", author: "apple" }, { quote: "good morning", author:.. 2022. 3. 30. #5 [2021 UPDATE] CLOCK #5.0 Intervals interval은 매번 일어나야 하는 무언가를 의미한다. 매 2초마다 무슨일이 일어나길 원할 때 사용. 이미 자바스크립트에 내장되어 있음 setInterval() 두개의 argument를 받는다. 첫째는 내가 실행하고자 하는 function 함수. 두번째는 function을 몇ms 간격으로 할지 5000ms = 5s(5초) function sayHello() { console.log("hello"); } setInterval(sayHello, 5000); 5초마다 콘솔에 hello가 나타난다. ========================== #5.1 Timeouts and Dates function을 딱 한번 호출하는데, 일정 시간이 흐른 뒤에 호출하는 것. setInterva.. 2022. 3. 30. javascript 사칙연산자 let a = 1; console.log(a++); ----------- 1이 더해지기 전. a는 1. 결과값은 1 console.log(a); ------------- 위의 1이 더해진 상태. 결과값은 2 console.log(++a); ------------- 1이 더해진 후. 결과값은 3 let a =1; console.log(a--); ------------ 1을 빼기 전. 결과값은 1 console.log(a); -------------- 위의 1이 빼진 상태. 결과값은 0 console.log(--a); -------------- 1을 뺀 후. 결과값은 -1 let a = 1; a += 1; ------------- a+1과 같은 의미 console.log(a); -------------- 결.. 2020. 7. 11. 이전 1 다음 반응형
