[JS] 콘솔에 출력, script async와 defer 차이

Hyodduru ·2021년 10월 25일
0

JavaScript

목록 보기
12/60
post-thumbnail

출처 : 유튜브 드림코딩 자바스크립트

Console API

API? Application Programming Interface

Console API는 Web API중 하나로 브라우저가 제공하는 함수들이다. (js가 제공하는 것 아님)

defer

HTML parsing이 시작되는 동시에 fetching js도 시작.
HTML parsing이 끝난 후 js를 실행시킨다.

여러 js를 받을 경우에도 parsing 이 후 실행되기 때문에 우리가 정의한 대로 순서가 유지가 된다.

async

HTML parsing이 시작되는 동시에 js fetching 시작. fetching 끝나자마자 js를 실행하고 이후 html parsing이 끝나면 html이 준비된다.

js가 html parsing이 다 되기도 전에 실행된다는 단점이 있다. 또한 여러 js를 다운받는 경우 순서가 뒤죽박죽이 될 가능성이 있다.

결론) defer을 쓰자!

<script src="main.js" defer></script>

use strict

순수 vanilla JS는 코드 맨 위쪽에 'use strict';를 적어주고 시작하는 것이 좋다.
why? JS자체가 굉장히 유연한 언어이기 때문에 개발자 입장에서 많은 실수를 만들 수 있다.
ex) 변수를 잘못 입력한다던가 등 등.
-js 내에 선언되지 않은 변수를 적는 경우, 브라우저상에서는 문제가 되지 않지만
'use strict'을 적는 경우 오류로 걸러진다.

profile
꾸준히 성장하기🦋 https://hyodduru.tistory.com/ 로 블로그 옮겼습니다

0개의 댓글