html 기본 서식
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
</head>
<body>
</body>
</html>
<body> 태그안에 html 코드를 작성
<script> 위치
<script>태그 위치는 <html>태그 사이에 두기만 하면 적용
파싱?
파싱(Parsing)이란 컴퓨터가 해당 문서를 인식하기위해 html 문서의 텍스트들을 컴퓨터가 이해 가능한 언어로 변환하는 과정이다
파싱을 할 때 위에서부터(head) 아래방향(body)으로 진행 되는데 이 때 script태그가 <head> 태그의 닫는 태그 뒤에 위치한다면 dom이 생성되기 전에 script가 존재하지 않는 dom을 건드리는 dom API를 사용한다면 에러가 발생할 수 있음
결론은 script 태그는 </body>바로 앞에 위치시키는 것이 좋다
<head> 태그 사이에 위치
<head> 태그 사이에 위치하는 방법은 좋은 방법이 아니다
JS 파일의 크기가 커질수록 웹사이트를 보는데까지 많은 시간이 소요되는 단점이 생긴다
DOM을 제어하고 조작하는 JS코드가 있다면 오류가 발생할 수 있다
<body> 태그 끝에 위치
<body> 태그 안 html 파일 작성 후 끝에 <script>가 위치하는 경우
JS 파일을 다운로드 하기 전 HTML 코드를 모두 파싱하기 때문에 USER가 화면을 빨리 볼 수 있다는 장점이 있다
하지만 HTML 코드가 JS에 의존적인 사이트라면 USER가 화면을 보기까지 똑같이 오랜시간이 걸릴 수 있다는 단점이 있다
JS 변수
var, let, const의 차이점
var는 중복선언이 가능하다
var로 선언한 변수는 동일한 이름을 동일하게 중복해서 선언이 가능한데 마지막에 할당된 값이 변수에 저장된다
필요할 때마다 변수를 유연하게 사용할 수 있다는 장점이 될 수 있지만 기존에 선언해둔 변수의 존재를 잊고 값을 재할당하는 등 실수가 발생할 가능성이 크다
let은 중복선언이 불가능하지만 재할당이 가능하다
var와 다르게 let은 해당 변수가 이미 선언되었다는 에러메세지가 출력되지만, 다른 값을 재할당 할 수 있다
const는 중복 선언이 불가능하고 재할당이 불가능하다
const는 자바의 상수와 같은데 한번만 선언이 가능하고 값을 재할당 할 수 없다
변수 선언에는 기본적으로 const를 사용하고 재할당이 필요한 경우에 한정해서 let을 사용하는 것이 좋다
객체를 재할당 하는 경우는 생각보다 흔하지 않다. const를 사용하면 의도치 않은 재할당을 방지해 주기 때문에 보다 안전하다