여러분이 읽고 있는 이 파트는 실행 환경에 독립적인 코어 자바스크립트(core JavaScript)를 다룹니다.
코어 자바스크립트를 다루고 있긴 하지만, 학습을 위해선 스크립트를 실행할 수 있는 환경이 필요합니다. 본 튜토리얼은 온라인으로 제공되기 때문에 실행환경으로 브라우저를 사용하도록 하겠습니다. Node.js와 같이 브라우저 이외의 환경에 주력하는 학습자를 위해, 브라우저 한정 명령어(alert 등)는 최소한으로 사용하도록 하겠습니다. 이런 명령어를 학습하는 데 시간을 보내지 않도록 말이죠. 브라우저 환경에서의 자바스크립트는 다음 파트에서 다루도록 하겠습니다.
먼저, 웹 페이지에 스크립트를 삽입하는 방법에 대해 알아봅시다. 참고로 Node.js와 같은 서버 사이드 환경에서 스크립트를 실행하고 싶다면 'node my.js'와 같은 명령어를 사용하면 됩니다.
<script> 태그를 이용하면 자바스크립트 프로그램을 HTML 문서 대부분의 위치에 삽입할 수 있습니다.
예시:
<script> 태그엔 몇 가지 속성(attribute)이 있습니다. 요즘엔 잘 사용하진 않지만, 오래된 코드에서 종종 이 속성을 발견할 수 있습니다.
**type 속성: <script type=…>**HTML4에선 스크립트에 type을 명시하는 것이 필수였습니다. 따라서 type="text/javascript" 속성이 붙은 스크립트를 어렵지 않게 찾을 수 있었습니다. 이젠 타입 명시가 필수가 아닙니다. 게다가 모던 HTML 표준에선 이 속성의 의미가 바뀌었습니다. 이제 이 속성은 자바스크립트 모듈에 사용할 수 있습니다. 모듈은 심화 내용이기 때문에 다른 파트에서 다시 이야기하도록 하겠습니다.
**language 속성: <script language=…>**이 속성은 현재 사용하고 있는 스크립트 언어를 나타냅니다. 지금은 자바스크립트가 기본 언어이므로 속성의 의미가 퇴색된 상황입니다. 더는 사용할 필요가 없어졌죠.스크립트 전후에 위치한 주석아주 오래된 책과 가이드에서는 다음과 같이 <script> 태그 안에 주석이 존재하는 걸 볼 수 있습니다.
모던 자바스크립트에선 이런 트릭을 사용하지 않습니다. 태그 옆에 붙은 주석은 <script> 태그를 처리하지 못하는 브라우저가 해당 스크립트를 읽지 못하게 하려고 사용했었죠. 지난 15년간 출시된 브라우저는 <script> 태그를 처리할 수 있으므로, 이런 형태의 주석을 보면 아주 오래된 코드라는 사실을 알 수 있습니다.
자바스크립트 코드의 양이 많은 경우엔, 파일로 소분하여 저장할 수 있습니다.
이렇게 분해해 놓은 각 파일은 src 속성을 사용해 HTML에 삽입합니다.
<script src="/path/to/script.js"></script>
여기서 /path/to/script.js는 사이트의 루트에서부터 파일이 위치한 절대 경로를 나타냅니다. 현재 페이지에서의 상대 경로를 사용하는 것도 가능합니다. 같은 폴더 내에 있는 파일인 "script.js"를 src="script.js"로 참조하는 것처럼 말이죠.
물론 아래와 같이 URL 전체를 속성으로 사용할 수도 있습니다.
<script src="<https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js>"></script>