바닐라JS

Basic Data Types >## 1. 숫자 숫자는 '' 또는 "" 없이 써도 console 이 알아서 계산을 함. 1) Integer(정수) ex) 2 2) float(실수) ex)1.5 >## 2. 문자 string : 처음부터 끝까지 모두 글자로 이뤄

값을 저장하거나 유지하는 역할을 함상수, 값이 바뀔 수 없음다음단어의 첫 문자를 대문자로 작성변수, 값이 바뀔 수 있음let은 새로 생성할 때 사용값이 바뀔 수 있음, 어떠한 규칙도 가지고 있지 않음var을 사용한다면 코드가 밑에서 무엇을 할지 모름 기본적으로 cons

변수에 아무것도 없는 상태 (false랑 다름)null은 절대 자연적으로 발생하지 않음비어있다는 것을 의도적으로 표현메모리에 변수가 저장되어 있지만 값이 없는 상태

데이터로 이뤄진 리스트하나의 변수 안에 데이터의 리스트를 가지는 것시작과 끝에 대괄호 \[]를 사용해야 함.array 안 각각의 항목은 쉼표로 구분되어야 함.인덱스는 0부터 (컴퓨터는 0부터 셈)\-> 금요일 fri를 받아오기 위해서는 대괄호 안에 5가 아닌 4를 넣어

Objects 리스트안에 다양한 데이터 타입이 존재하면 각각이 무엇을 나타내는지 알아내기 어려움 Objects는 각각의 데이터들이 무엇을 나타내는지 알아볼 수 있음 Objects는 property를 가진 데이터를 저장하도록 해줌 Objects는 중괄호를 사용 1)

어떤 코드를 캡슐화해서, 실행을 여러번 할 수 있게 해줌

return에 의해서 함수 안의 결과를 함수 밖에서 새로운 변수로 받아 사용할 수 있음한번 return하면 그 함수는 끝남

if문 형태입력받는 값이 숫자인지 판별하는 조건문if가 두개 이상 필요할 경우 형태and 조건. 모두 충족 시 trueor 조건. 하나만 충족시 true음주 가능 나이 판별

ex)받아온 element의 html 내용 바꾸는 방법ex)ex)querySelector는 첫번째 element만 가져옴모든 element를 가져오고 싶다면 querySelectorAll을 사용하면 됨selector 안의 조건에 부합하는 모든 element를 가져다줌

이벤트는 엄청 다양하게 존재property 이름 앞에 on이 붙어있다면 event listener.엘리먼트를 클릭했을 때 발생하는 이벤트ex)마우스가 엘리먼트 위에 올라갔을 때 발생하는 이벤트ex)마우스가 엘리먼트 위에서 나갈 때 발생하는 이벤트ex)

style.cssapp.jsapp.jsapp.js

이벤트들은 함수를 실행할 때 argument를 1개 주면 그곳에 event 정보들을 담을 수 있음.object에는 방금 일어난 event에 대한 여러 정보가 담겨 있음.기본적으로 제공되는 function브라우저가 기본 동작을 실행하지 못하게 막아주는 기능ex)ex)

로그인 기능을 구현하려면 localStorage에 정보 저장하여 사용local storage는 browser에서 제공하는 DB로 key:value로 데이터를 저장.로컬 저장소에 해당 키와 값을 저장함.로컬 저장소에 해당 키에 해당되는 값을 불러옴.로컬 저장소에 해당 키

Clock 1) setInterval 반복적으로 n초마다 함수를 실행시킴 ex) 2) setTimeout n초 뒤에 함수를 실행시킴 3) Date

0부터 1 사이 무작위의 값을 반환해줌내림올림반올림

현재 내 위치의 위도와 경도 받아오기

JS에서 canvas를 사용해 브라우저에 2D 혹은 3D 그래픽을 그릴 수 있음.캔버스에 그림을 그릴 때 사용하는 붓 = contextcss에서 캔버스 크기 설정을 한 후 js에서도 작성해준다.이후에는 width 와 height를 js에서만 수정할 것임 (css에서 X