자바스크립트 기본 - Hello, world!

script 태그

<script> 태그를 이용하면 자바스크립트 프로그램을 HTML 문서 대부분의 위치에 삽입할 수 있다.

브라우저는 <script> 태그를 만나면 안의 코드를 자동으로 JS 엔진으로 처리하고 실행한다.

모던 마크업

<script> 태그에는 몇 가지 속성이 있다. 요즘에는 잘 사용하지 않지만, 오래된 코드에서 종종 발견할 수 있다.

• type HTML4에서는 type 을 명시하는 것이 필수였기 때문에, type=”text/javascript” 속성이 붙은 스크립트를 쉽게 찾아볼 수 있었다. 그러나 이제는 타입을 필수적으로 명시하지 않아도 되며, 모던 HTML 표준에서는 type 속성이 다른 의미(모듈)를 가지게 되었다.
• language 현재 사용하고 있는 스크립트 언어를 나타낸다. 현재는 자바스크립트가 기본언어이므로 굳이 사용할 필요가 없다.

외부 스크립트

스크립트 코드의 양이 많은 경우, 파일로 소분하여 저장할 수 있다.

소분된 파일은 src 속성을 사용해 HTML에 삽입할 수 있다.

src 속성이 있으면 script 태그 내부의 코드는 무시된다!!!

<script src="/js/script1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

💡 내부 스크립트 vs 외부 스크립트
HTML 안에 직접 스크립트를 작성하는 방식은 스크립트가 아주 간단할 때만 사용한다. 스크립트가 길어지면 별도외 외부 파일로 작성하는 것이 좋다! 외부 스크립트를 사용하면 브라우저가 스크립트를 다운받아 캐시에 저장하기 때문에 성능상 장점이 있다. 여러 페이지에서 동일한 스크립트를 사용하는 경우 브라우저는 페이지가 바뀔 때마다 스크립트를 새로 다운받지 않고, 캐시로부터 스크립트를 가져와 사용한다. (스크립트를 한번만 다운받아서 재사용) → 트래픽이 절약되고, 웹 페이지 로드 속도가 빨라진다!