[javascript 기초 강좌] 1. Javascript 기본 사용법

모든 강좌는 실무 기준으로 작성되며 이론 및 내부 구조 등이 궁금하신 분들은 직접 검색하시고 공부하시기 바랍니다.

 

javascript 를 사용할 수 있도록 필요한 최소한을 설명합니다. 

 

 

 

javascript (자바스트립트)는 미국 선마이크로시스템스와 넷스케이프 커뮤니케이션스가 개발한 웹 브라우저에서 동작하는 스크립트 언어입니다.

클라이언트 기반의 객체지향 언어이고 가볍고 빠른 장점이 있습니다.

별도의 컴파일도 필요 없으며 변수들의 타입선언도 필요 없어 쉽게 배울 수 있습니다.

웹 문서를 동적으로 처리하며 이벤트( 키보드, 마우스, 클릭, 등 )를 사용하여 클라이언트의 처리 기능을 주로 담당합니다.

 

 

먼저 Html 강좌 http://cofs.tistory.com/120 를 모두 마스터 하고 오셔야 합니다.

 

Html 을 선행학습하고 Javascritp 를 공부하는 것을 추천합니다.

 

Html 에 대해서는 설명하지 않습니다.

 

 

1. Javascript 의 기본적인 사용 방법에 대해 설명합니다.

 

그림을 보며 설명해 드리겠습니다.

 

먼저 1번 빨간 상자를 주목합니다.

 

javascript 를 사용하려면 javascript를 사용하고 싶은 구역을 태그를 이용하여 나눠야 합니다.

아래처럼 script 태그로 이 영역은 javascript를 사용하는 곳이라고 알려줘야 합니다.

<script type="text/javascript">

 

</script>

 

그리고 javascript 영역 내에는 주석을 사용할 수 있는데 ' // ' 이후에 사용하는 글들은 주석처리되어 화면에 보이지 않습니다.

여러줄을 주석처리 하고 싶을 때에는 ' /*  여기에 작성 줄바꿔도 가능해요 */ ' 이렇게 작성합니다.

 

그리고 보통 javascript는 1번처럼 head 영역에 작성하는데

 

Tip을 드리자면

 

Javascript 영역은 body 가장 아래에 작성하는 것이 좋습니다.

 

이유는 javascript 가 랜더링 될 때 순차적으로 되는데 javascript를 가지고 html 태그들을 컨트롤 할 경우가 대부분입니다.

 

몇천 라인의 내용이 가득한데 마지막줄의 div 태그를 컨트롤 하려면 div 태그가 그려진 다음에 javascript 가 실행되야하는데 간혹 오류로 인하여 그 전에 javascript 가 실행되거나 이상동작을 하는 경우가 발생합니다.

 

그래서 저를 포함한 몇몇 개발자들은 javascript 영역이 최 하단이 맞다고 판단합니다.

 

하지만 지금은 연습이고 가독성을 위해 head 영역에 작성합니다.

 

다시 본론으로 돌아와서 1번처럼 head 영역에도 작성 가능하지만 2번처럼 아무 영역에도 작성 가능합니다.

 

단 실행 순서는 순차적이니 이에 주의하시면 되겠습니다.

 

 

javascript 내에서 어떤 명령을 내리고 그 명령이 끝날 때는 꼭 세미콜론 (;) 을 사용합니다.

 

또한 변수나 명령(함수) 등은 대소문자를 구분합니다.

 

document.write("내용"); 의 명령은 body 태그 내부에 내용을 입력하는 명령입니다.

 

일반 텍스트를 사용할 수 도 있고 1번의 첫번째 명령처럼 태그를 텍스트처럼 입력하면 실행시킬 때 태그를 적용한 텍스트를 화면에 보여줍니다.

 

실행은 html 과 같습니다.

 

위 내용을 html파일로 저장하시면 됩니다.

 

모르시는 분은 Html 강좌 http://cofs.tistory.com/120 를 참고합니다.

 

ex) 첫번째스크립트.html

명령의 순서, html 태그의 순서대로 화면에 표시되는 것을 확인할 수 있습니다.