웹마스터 팁

자바스크립트 이해하기...두번째 : 함수와 루프


함수

함수는 누군가 어떠한 행동을 취했을때 자바스크립트로 하여금 그것을 읽어드리고 반응하는 것을 쉽게 하여 줍니다. (설명이 좀 이상하지만 걍 넘어갑니다;;)

<Script Language="Javascript">
function eccen()
{
여기에 자바스크립터 넣기;;
}
</script>

위와 같은 간단한 구문으로 eccen 이란 함수가 생성됩니다.
여기서 { 와 } 는 함수의 시작과 끝을 의미하며 HTML 역시 포함할 수 있습니다.

예제 보기 : http://ifusionx.naool.com/tutorials/javascript/javabasic2-1.htm

이로서 함수에 대한 기본은 끝.

---------------------------------------------------

루프

루프는 특정 일을 반복하여 실행하게 하여줍니다. 루프는 특정 일을 반복하여 실행하게 하여줍니다. 루프는 특정 일을 반복하여 실행하게 하여줍니다.

그만 반복 하라고요? 죄송합니다. 으윽;;

루프에는 두종류가 있습니다. For 루프하고 While 루프가 그것이지요. 엄연히 다른 종류의 루프지만 같은 일을 수행하는 것 역시 가능하긴 합니다.

일반적으로 For 루프는 특정 일이 몇번이나 반복될지 알고 있을때에 이용됩니다.

예를 들어 인치 (inch) 를 센티미터(cm)로 변환하여 50인치까지의 결과를 테이블로 출력하려 하려 한다면 For 루프를 이용해야 할테고
혹 센티미터가 200 될때까지의 결과를 출력하고자 한다면 While 루프를 사용하는 것이 좋습니다.


아래는 For 루프를 사용한 예 입니다.

<Script Language="JavaScript">
for (변수이름=시작숫자; 변수이름 <= 끝숫자; 변수이름=변수이름+스텝넘버;)
{
//루프 부분
}
</script>


여기서 스텝넘버란 출력되는 두 수간의 차이를 의미합니다.
아래는 센티미터와 인치를 이용한 예제.

우선 1인치는 2.54센티미터라는 점은 알아야 하겠죠 ^^~

<Script Language="JavaScript">
for (inches=0; inches <= 50; inches=inches + 1;)
{
document.write("<tr><td>"+inches+"</td><td>"+(inches*2.54)+"</td></tr>")                                        
}
</script>


예제 보기 : http://ifusionx.naool.com/tutorials/javascript/javabasic2-2.htm

이로 For 루프에 대한 간단한 강좌는 끝.

---------------------------------------------------


이제 While 루프에 대해 공부해봐야 하겠죠?

<Script Language="JavaScript">
while (variablename <= 50) {
//루프 부분
}
</script>

While 루프는 어찌보면 For 루프보다도 간단할 수 있습니다. (예제에서는 더 길지만 -_-;;;)
다만 언제 루프가 끝나는지를 지정해줘야 하며 예제에서는 센티미터가 200이 될때 까지 출력하도록 하였습니다.


<Script         Language="JavaScript">                
inches=0; centimeter=0; while (centimeter <= 200) {
document.write("<tr><td>"+inches+"</td><td>"+centimeter+"</td></tr>")
inches=inches + 1
centimeter=inches * 2.54
}
</script>


위의 While 루프에서의 스크립트는 센티미터가 200에 가장 가까워진 순간 출력을 끝내게 됩니다.

예제 보기 : http://ifusionx.naool.com/tutorials/javascript/javabasic2-3.htm

---------------------------------------------------
이걸로 오늘 강좌 끝~
뭐 오늘 강좌라고 하니 매일 강좌올리는 것처럼 들리는데;; 가끔 생각날때마다 올립니다;;
혹 돌던지실 분이 계실까 미리 적는중 -0-~

PS - 지난번에 잘못된 점 지적해주신 양태군님과 이동기님께 감사의 뜻을 전합니다. ^^*
강좌는 허락없이 가져가실 수 없습니다 -_-++

eccen.gif
제목 글쓴이 날짜
자바스크립트 이해하기...1 [13] file Eccen 2002.05.26
자바스크립트 이해하기...2 [1] file Eccen 2002.05.30
어설픈 링크방지[정확한 경로로 오세요] [5] 이성영 2002.05.30
마우스에 축구공 따라다니는 자바 스크립트.. [6] file MR.HMH 2002.05.30
서서히 이미지를 변경시켜주는 환상적인 룰오버효과 [7] ▩윤미 2002.05.31
자바스크립트 이해하기...3 [1] file Eccen 2002.06.05
플래쉬 효과나는 신비 메뉴 - -? *수정+카피라이터~ [17] ▩윤미 2002.06.09
부드럽게 스크롤바를 따라다니는..+_+ [6] 키르(絶對) 2002.06.13
원하는시간에 팝업창을 띄우고 원하는 시간에 닫어뻐리는;; [2] 키르(絶對) 2002.06.13
[수정] 랜덤배경음악 + 폼버튼 [1] keymove 2002.06.13
랜덤메시지 + 흐르는 메세지 [4] keymove 2002.06.13
뭐 다 할줄아시겠지만 -_- absolute positioning [3] [º^^º]MISO 2002.06.13
웹상에서도 내맘데로 이미지 크기를 조절할 수 있다?? [9] ▩윤미 2002.06.13
클릭으로 배경이미지 변경 [4] keymove 2002.06.14
배경색과 글자색같이 변화시키기 keymove 2002.06.14
배경색과 글자색같이 변화시키기 2 keymove 2002.06.14
강추!! 요리조리 날라다니는 놈을 잡아랏...!! ;; [6] 키르(絶對) 2002.06.14
접속할때마다 바뀌는 제목표시줄 오토™ 2002.06.16
팝업창에서 부모창 링크 제어하기(노프레임 및 프레임 적용가능) [9] 양지다컴 2002.06.17
순수 자바스크립트로 작성된 계산기... [2] 용가리 2002.06.22