검색결과 리스트
Java Script에 해당되는 글 44건
- 2011.08.01 Function 객체
- 2011.07.26 Math 객체
- 2011.07.25 Date객체
- 2011.07.21 Array 객체
- 2011.07.19 사용자 입력함수 prompt
- 2011.07.17 confirm함수
- 2011.07.14 함수의 기분구조와 alert내장함수
- 2011.07.12 do while문 - 자바스크립트
- 2011.07.10 while문
- 2011.07.08 자바스크립트 - for문
글
Function 객체
안녕하세요?
오늘은 Function객체에 대해서 배워보겠습니다. Function은 함수라고 하지요. 앞에서 배운 여러가지 함수가 있었는데 이 객체는 그런 함수를 만들어 주는 객체입니다. 예를들어 add를 Function으로 선언해놓고 두수를 더해서 값을 return하는 걸로 만들수가 있다는 것입니다. 그럼 예제를 통해서 보도록 하지요. 예제를 보시면 아 그렇구나 하실겁니다. 그전에 이 객체의 형식은
변수 = new Function(변수1,변수2,변수3,...,함수내용)
입니다.
그럼 예제를 보시죠.
<html>
<head><title>Function객체</title>
<script>
add=new Function("a","b","return (a+b)")
sub=new Function("a","b","return (a-b)")
mul=new Function("a","b","return (a*b)")
div=new Function("a","b","return (a/b)")
document.write("10+30은 "+add(10,30)+"<BR>")
document.write("10-30은 "+sub(10,30)+"<BR>")
document.write("10*30은 "+mul(10,30)+"<BR>")
document.write("10/30은 "+div(10,30)+"<BR>")
</script>
</head>
</html>
add는 변수명이고 Function("a","b","return (a+b)") 에서 a,b는 함수의 매개변수입니다. return(a+b)는 a와 b를 더한값을 리턴 즉 돌려줘라 하는 겁니다. add는 마치 함수처럼 사용됩니다. 그래서 뒤의 두 매개변수를 주면 두수를 더하게 됩니다. 나머지 뺄셈, 곱셈, 나눗셈도 마찬가지입니다. 이해가지죠? 선언은 이렇게 해놓고 사용은 아래에 있는 것처럼 add(10,30) 이런식으로 10과 30을 더하라는 뜻입니다.
이해가 가셨으리라 생각하고 간단하게 실행결과를 보고 마치도록 하겠습니다.
결과는,
'Java Script' 카테고리의 다른 글
| 마우스 오른쪽 버튼 사용금지 (3) | 2011.08.08 |
|---|---|
| 시간대별로 다른 인사 나타내기 (0) | 2011.08.04 |
| Math 객체 (0) | 2011.07.26 |
| Date객체 (0) | 2011.07.25 |
| Array 객체 (0) | 2011.07.21 |
글
Math 객체
지난번에는 날짜객체에 대해서 배워보았습니다. 오늘은 수학객체 즉 Math객체에 대해서 배워보도록 하겠습니다.
Math객체의 속성에는 10의 자연로그값을 구하는 LN10, 파이값을 구하는 PI등이 있고 메소들에는 절대값을 구하는 abs 둘중에 큰값을 반환하는 max, 작은값을 반환하는 min등이 있습니다. 그럼 이것을 이용해서 소스코드를 한번 만들어 봅시다.
<html>
<head>
<title>Math객체</title>
<script>
document.write("원주율 PI "+Math.PI+"<BR>")
document.write("10의 자연로그 "+Math.LN10+"<BR>")
document.write("-3의 절대 값 "+Math.abs(-3)+"<BR>")
document.write("10,12중에 큰값 "+Math.max(10,12)+"<BR>")
document.write("6,2중에 작은값 "+Math.min(6,2)+"<BR>")
</script>
</html>
Math하고 점찍고 속성이나 메소드를 사용하면 됩니다. 첫줄은 PI를 두번째줄은 10의 자연로그(학교 졸업한지 오래되서 무슨말인지는 잘 모릅니다.ㅎㅎ) 세번째는 절대값, -3의 절대값은 3이겠죠. 네번째 max(10,12)는 10과 12중에 큰값은 12를 반환합니다. 그리고 min(6,2)는 두수중에 작은 것이니깐 2를 반환합니다. 결과를 보면 쉽게 이해가 되시겠지요?
이런식으로 출력이 됩니다. 별로 어렵지 않았으리라 생각됩니다. 그럼 다음시간에 또 만나요~
'Java Script' 카테고리의 다른 글
| 시간대별로 다른 인사 나타내기 (0) | 2011.08.04 |
|---|---|
| Function 객체 (0) | 2011.08.01 |
| Date객체 (0) | 2011.07.25 |
| Array 객체 (0) | 2011.07.21 |
| 사용자 입력함수 prompt (0) | 2011.07.19 |
글
Date객체
지난번에는 배열객체 Array객체에 대해서 배웠습니다. 오늘은 날짜객체 Date객체에 대해서 배워보겠습니다. Date는 날짜라는 뜻이죠. 2011년 7월 25일 월요일 이런 객체입니다. 여기서 년도 월 일 요일 이것들을 Date객체로 처리할 수 있습니다. 예제를 보면서 이해해 나가도록 합시다.
<html>
<head><title>Date객체</title>
<script>
var d=new Date();
document.write("오늘의 날짜는 "+d.getFullYear()+"년"+(d.getMonth()+1)+"월"+d.getDate()+"일 입니다.<BR>")
</script>
</head>
</html>
var d=new Date() 로 d를 날짜객체로 생성시킵니다.
d.getFullYear는 년도를 구하는 메소드입니다. d.getMonth는 달을(0이 1월이므로 +1을 해줘야합니다.) d.getDate는 날짜를 구하는 메소드입니다.
실행하면
오늘은 날짜객체 Date객체에 대해서 간단하게 알아봤습니다. 다음에 또 만나요~
'Java Script' 카테고리의 다른 글
| Function 객체 (0) | 2011.08.01 |
|---|---|
| Math 객체 (0) | 2011.07.26 |
| Array 객체 (0) | 2011.07.21 |
| 사용자 입력함수 prompt (0) | 2011.07.19 |
| confirm함수 (0) | 2011.07.17 |
글
Array 객체
저번까지는 자바스크립트 내장함수에 대해서 배웠습니다. 오늘부터는 내장 객체에 대해서 알아보겠습니다. 객체란 말은 저도 잘은 모르지만 예를들어 모니터가 있으면 모니터의 종류,모양,생깔,크기 이런것은 속성이라고 합니다. 모니터는 객체구요. 그리고 모니터를 동작하도록 설정하는 것은 메소드라고 합니다. 쉽게 말해서 하나의 물건은 객체이고 그 물건의 특징은 속성이고 그것의 기능들은 메소드라고 보시면 되겠습니다. 메소드는 방법이라는 뜻이죠.
예를들어 오늘배울 array 객체는 배열이라는 뜻인데 속성과 메소드를 가지고 있습니다. 속성은 length즉 배열의 갯수를 반환하는 것이있고 concat은 두개의 배열을 하나로 연결시키는 것, 그리고 join은 배열의 값을 하나로 연결하는 것, reverse는 배열의 내용을 거꾸로 반환하는 것, sort는 배열을 정렬하는 것 이런 메소드들이 있습니다. 간단한 예제를 보면 쉽게 이해가 가실겁니다. 먼저 배열의 길이를 구하는 length속성예입니다.
<html>
<head><title>Array객체</title>
<script>
a=new Array(10,20,30,40)
b=a.length
document.write("배열의 갯수는 "+b+"개입니다.")
</script>
</head>
</html>
자 우리가 모르는 부분은 a=new Array(10,20,30,40) 입니다. 이 말은 a라는 객체에 new니깐 새로 만들고 a라는 객체는 Array 즉 배열객체라는 말입니다. 그리고 그 값은 10,20,30,40 이렇게 4개를 가지고 있구요. 이해가시죠? 그다음에 b=a.length 하고 했는데 이 말은 객체배열 a의 length(길이,갯수)를 b라는 변수에 저장하라는 말입니다. 그러니깐 4개니깐 b의 값은 4가 되겠지요?
그다음에 화면에 출력하게 되는 것입니다. 여기까지 이해가시리라 믿고 다음 메소드들에 대해 알아봅시다. 먼저 join메소드입니다. 이것은 배열들을 한데 묶는 것입니다. 다음예를 보시죠.
<html>
<head><title>Array객체</title>
<script>
a=new Array(10,20,30,40)
b=a.join("+")
document.write(b)
</script>
</head>
</html>
이번에는 length가 아니고 join("+") 이렇게 b의 값이 되었습니다. 이 말은 10,20,30,40을 +를 사용해서 묶어라 하는 내용입니다. 즉 10+20+30+40 이렇게 하라는 말입니다. +를 안쓰면 그냥 ,로 나타납니다. 즉 10,20,30,40이렇게 됩니다.
그다음은 concat메소드입니다. 이것은 두개의 배열을 하나로 연결시켜주는 것입니다. 다음 예를 보시죠.
<html>
<head><title>Array객체</title>
<script>
a=new Array(10,20,30,40)
b=new Array("안녕","자바스크립트")
c=a.concat(b)
document.write("a와 b배열을 합치면 "+c)
</script>
</head>
</html>
a배열과 b배열을 선언했습니다. 그리고 c에다가 a.concat(b)했는데 이말은 a의 합치는 것을 실행하는데 b배열과 합쳐라 하는 내용입니다. 그것을 c에다가 저장해라 하는 거지요. 그럼 결과는 어떻게 나올까요?
10,20,30,40,안녕,자바스크립트
이렇게 나오겠죠? 두 배열객체를 합쳤으니깐요.
그다음에는 마지막으로 sort메소드를 해봅시다. sort는 말그대로 정렬하다는 뜻이죠. 그래서 배열의 값을 정렬해서 보여줍니다. 다음예를 보시죠.
<html>
<head><title>Array객체</title>
<script>
a=new Array(30,10,20,40)
b=a.sort()
document.write("a배열을 정렬하면 "+b)
</script>
</head>
</html>
이렇게 하면 a배열객체를 정렬해서 b에다가 값을 입력해라 하는 내용이지요? 이젠 다 이해하실정도가 된다고 봅니다만. 자 이것을 불러와보면 어떻게 결과가 나올까요? 물론 정렬된 상태로 나오겠지요?
즉 10,20,30,40 이렇게 나올겁니다.
오늘은 자바스크립트의 내장객체 중 하나인 Array 배열객체에 대해서 배워보았습니다. 어렵지요? 그래도 이정도는 쉬운겁니다 그죠? 계속 더 어려워질건데 각오 단단히 하고 공부합시다. 그럼 다음에 또 만나요~
참고서적 : 알찬예제로 배우는 HTML+자바스크립트
'Java Script' 카테고리의 다른 글
| Math 객체 (0) | 2011.07.26 |
|---|---|
| Date객체 (0) | 2011.07.25 |
| 사용자 입력함수 prompt (0) | 2011.07.19 |
| confirm함수 (0) | 2011.07.17 |
| 함수의 기분구조와 alert내장함수 (0) | 2011.07.14 |
글
사용자 입력함수 prompt
안녕하세요?
지난번에는 confirm함수에 대해서 배웠습니다. 이번에는 prompt함수에 대해서 배워보도록 하겠습니다. prompt함수는 사용자가 입력할수 있도록 해 줍니다. 예를들어 "당신의 이름은?"이라는 물음에 이름을 입력할수 있도록 대화상자를 출력하고 그 이름을 입력받아서 화면에 출력도 할 수 있게 해줍니다. 간단한 예제를 보면 이해가 빠르실겁니다.
<html>
<head><title>prompt함수</title>
<script>
var s
s = prompt("이름을 입력하세요.","");
document.write("당신의 이름은 "+s+" 입니다.")
</script>
</head>
</html
var s <- s라는 변수를 선언합니다. 이 변수는 prompt함수에서 되돌려지는 값을 저장할겁니다. 예를들어 이름을 "마하카사파"라고 입력하면 s의 값은 마하카사파가 되는 겁니다. 그다음에
s = prompt("이름을 입력하세요.","") <- prompt함수를 실행하고 그 결과값을 s에 저장합니다.
그다음에 document.wirt는 아시죠? 화면에 이름을 뿌려주는 역할을 합니다.
실행시켜보면...
이런 입력대화상자가 나타납니다.
이름을 입력합니다.
이렇게 문자가 표시됩니다.
이 prompt대화상자는 사용자에게 어떤 정보를 입력받을때 유용하게 사용될수 있을 것입니다.
그럼 이번에는 이름을 입력하고 나이도 물어보고 나서 그 이름과 나이도 함께 출력하는 코드를 작성해보도록 하겠습니다. 이름은 위의 것을 사용하면 되고 나이도 똑같습니다. prompt문을 한번더 써주시면 되겠습니다.
var age
age=prompt("나이는 몇살이에요?","")
이렇게요. 그런다음 출력할때 age만 더해주면 되지요. 소스는
<html>
<head><title>prompt함수</title>
<script>
var s, age
s = prompt("이름을 입력하세요.","");
age = prompt("나이가 어떻게 되세요?","");
document.write("당신의 이름은 "+s+" 이고 나이는 "+age+" 입니다.")
</script>
</head>
</html>
실행은 직접해보시기 바랍니다.
그럼 이번에는 성별까지 물어보는건 어떻게 할까요?
일단 성별변수를 하나주고,
var sex
성별을 물어봐야겠죠? 남자면 1 여자면 2이렇게요.
sex=prompt("남자면 1 여자면 2를 입력하세요.","")
여기서 sex에 1이 들어오면 남자를 출력하고 2가 들어오면 여자를 출력하면 되겠죠? 저번에 배운 if else구문을 이용하면 됩니다.
if (sex ==1)
document.write("당신의 이름은 "+s+" 이고 나이는 "+age+" 이고 남잡니다.")
else document.write("당신의 이름은 "+s+" 이고 나이는 "+age+" 이고 여자군요.")
만약에 sex가 1이라면 (==이 같다는 뜻이죠) 남자라고 출력하고 그외의 것이면 여자라고 출력해라 이런뜻입니다.
전체코드입니다.
<html>
<head><title>prompt함수</title>
<script>
var s, age, sex
s = prompt("이름을 입력하세요.","");
age = prompt("나이가 어떻게 되세요?","");
sex = prompt("남자면 1 여자면 2를 입력하세요.","")
if (sex ==1)
document.write("당신의 이름은 "+s+" 이고 나이는 "+age+" 이고 남잡니다.")
else document.write("당신의 이름은 "+s+" 이고 나이는 "+age+" 이고 여자군요.")
</script>
</head>
</html>
실행은 직접 해보시기 바랍니다.
오늘은 사용자가 직접 정보를 입력하는 prompt함수에 대해서 배워보았습니다. 그럼 다음시간에 또 만나요~!
'Java Script' 카테고리의 다른 글
| Date객체 (0) | 2011.07.25 |
|---|---|
| Array 객체 (0) | 2011.07.21 |
| confirm함수 (0) | 2011.07.17 |
| 함수의 기분구조와 alert내장함수 (0) | 2011.07.14 |
| do while문 - 자바스크립트 (0) | 2011.07.12 |
글
confirm함수
안녕하세요?
오늘은 자바스크립트 내장함수중에 confirm함수를 배워보겠습니다. confirm은 확인하다라는 뜻을 가지고 있지요? 형식은
ok = confirm(문자열)
이렇게 됩니다. 예를들어
ok = confirm("입력을 취소하시겠습니까?")
이렇게 하면 화면에
if (ok==true) 이렇게하면 만약에 ok가 true값이 넘어왔으면 그런뜻이죠. 그러면 뒤에 문장을 써주시면 되겠습니다.
if (ok==true) document.write("입력이 취소되었습니다.")
이렇게요. 만약에 확인이 눌러졌으면 (여기서 ==는 같다라는 뜻입니다.) 입력이 취소되었습니다라고 출력하라는 말입니다. 취소가 눌러졌으면은 어떻게 할까요? else를 배우셨죠? else를 쓰면 됩니다.
else document.write("다시 입력합니다.")
이렇게요. 그럼 대충 이해가 가시죠? 전체 소스코드를 한번 볼까요?
<html>
<head><title>confirm함수</title>
<script>
ok=confirm("입력을 취소하시겠습니까?")
if (ok==true) document.write("입력이 취소되었습니다.")
else document.write("다시 입력합니다.")
</script>
</head>
</html>
이렇게 됩니다. 실행하면 어떻게 될까요? 위의 대화상자가 나오면서 확인을 누르면 입력이 취소되었습니다라고 윈도우창에 쓰고 취소를 누르면 다시 입력합니다라고 쓰겠지요?
확인을 눌렀을때입니다.
대충 이해가 가시죠? 그럼 오늘은 여기까지 하고 다음시간에 다시 만나요~
참고 : OkOkOK 알찬 예제로 배우는 HTML+자바스크립트
'Java Script' 카테고리의 다른 글
| Array 객체 (0) | 2011.07.21 |
|---|---|
| 사용자 입력함수 prompt (0) | 2011.07.19 |
| 함수의 기분구조와 alert내장함수 (0) | 2011.07.14 |
| do while문 - 자바스크립트 (0) | 2011.07.12 |
| while문 (0) | 2011.07.10 |
글
함수의 기분구조와 alert내장함수
장마가 끝나가네요. 모두들 건강하게 여름을 나고 계신지 모르겠네요.
저번까지 선택문과 반복문에 대해서 배워봤습니다. 오늘은 함수에 대해서 배워보겠습니다. 함수가 뭐냐면 영어로는 function인데 기능이라는 뜻이죠? 수학에서도 함수가 있지요? 예를들어 두수를 더하는 경우를 생각해봅시다.
c = a + b;
이제까지 배운대로 이렇게 하면 되지요? 근데 이것을 함수를 이용해서도 할 수 있습니다. 더하는 함수 add함수를 만들어서
c = add(a,b)
이런식으로 add함수에 a,b라는 두 인자를 전달해서 a+b를 계산하도록 할수도 있다는 말입니다. 그럼 add함수를 작성해야겠죠?
function add(a,b)
{
return a+b
}
이렇게 작성하면 됩니다. add함수이고 인수로 a,b를 가지고 return은 돌려주다는 영어죠. 값을 돌려준다는 말입니다. 여기서는 a+b의 값을 돌려주니깐 두수를 더한 값이 됩니다. 이제 함수에 대해 대충 이해가 가시는지요? 지금까지 한 이야기 소스코드입니다.
<html>
<head><title>함수</title>
<script>
function add(a,b)
{
return a+b
}
c = add(1,2)
document.write(c)
</script>
</head>
</html>
이렇게하면 결과는 3이 나오겠죠?
자 이게 함순데 자바스크립트에는 많은 내장함수가 있습니다. 즉, 우리가 일일이 함수를 만들지 않아도 자바스크립트에서 기본적으로 제공하는 함수가 있다는 말입니다. 오늘은 그중에 alert함수를 배워보겠습니다. alert라고 하면 알림이라는 뜻이죠. 사용자에게 뭔가를 경고해준다는 겁니다. 그럼 이 함수를 이용해서 제홈피를 찾아주셔서 감사합니다 라는 문구로 알림메시지를 작성하는 소스코드를 한번 만들어 보겠습니다.
<html>
<head><title>함수</title>
<script>
alert("제 홈피를 찾아주셔서 감사합니다^^")
</script>
</head>
</html>
이렇게 하면 됩니다. 어때요? 간단하죠? 단지 alert함수뒤에 문장만 써주면 됩니다. 그럼 실행해볼까요?
위와 같이 메시지 창이 뜨면서 확인버튼까지~ 간단하죠?
오늘은 여기까지~ 다음시간에 또 만나요~
'Java Script' 카테고리의 다른 글
| 사용자 입력함수 prompt (0) | 2011.07.19 |
|---|---|
| confirm함수 (0) | 2011.07.17 |
| do while문 - 자바스크립트 (0) | 2011.07.12 |
| while문 (0) | 2011.07.10 |
| 자바스크립트 - for문 (0) | 2011.07.08 |
글
do while문 - 자바스크립트
안녕하세요?
저번에는 while문에 대해서 배워봤습니다. 오늘은 do while문에 대해서 배워보겠습니다. 이것도 역시 반복문인데요. 사용방법은 다음과 같습니다.
do {
문장
} while (조건)
이렇게 됩니다. 파스칼의 repeat until 구문하고 똑같습니다. 지금은 없어진 언어지만...자 while문은 처음에 조건이 만족되면 실행이 됐지만 이것은 처음에는 무조건 실행이 됩니다. 왜냐? 조건이 없으니깐 그냥 실행이 되지요. 근데 뒤에 조건까지 가서 조건을 보고 조건이 맞으면 계속 루프를 돌고 조건이 틀리면 루프를 그만 돌리게 됩니다. 어렵지요? 쉽게 한번 예를 들어보겠습니다.
i=0
do { <- 요표시는 do while 문의 시작이라는 뜻입니다.
i++
}
while(i<100)
자 이렇게 하면 i를 하나 증가시키고 while문에서 i가 100보다 작은가를 보고나서 100보다 작으면 계속 루프를 돌리게 되는겁니다. 이제 이해가 가시죠?
그럼 이 do while문을 이용해서 이제까지해본 100까지 더하는 코드를 작성해봅시다.
var i=0; <-- 100까지 셀겁니다.
var sum=0; <-- 100까지 더한 값이죠.
do
{
i++ <- i를 100까지 하나씩 더합니다.
sum = sum + i <- 합계를 누적해 갑니다.
}
while(i<100)
이렇게 하면 되는데요. 맨끝에 i<100 은 만약에 i가 99면 i++에서 이미 100이 되어버리죠? 그래서 i<=100이 아니고 i<100입니다. i<=100이렇게 하면 최종i값은 101이 되어버리니깐 101까지 더하는게 되어 버리거든요.
여기까지 이해하셨나요? 그럼 전체 소스코드를 한번 봅시다.
<html>
<head><title> do while문 </title>
<script>
var i=0;
var sum=0;
do
{
i++
sum=sum+i
} while(i<100)
document.write("1에서 100까지 합은 : "+sum)
</script>
</head>
</html>
이렇게 됩니다. 물론 실행하면,
이렇게 답이 나옵니다. 이제 1부터 100까지 더하는 프로그램은 for,while,do while 아무거나 사용해서 다 만드실 수 있겠지요? ㅎㅎ 다음시간부터는 함수에 대해서 같이 공부해 보도록 하겠습니다. 바이~
'Java Script' 카테고리의 다른 글
| confirm함수 (0) | 2011.07.17 |
|---|---|
| 함수의 기분구조와 alert내장함수 (0) | 2011.07.14 |
| while문 (0) | 2011.07.10 |
| 자바스크립트 - for문 (0) | 2011.07.08 |
| swith 문 (0) | 2011.07.06 |
글
while문
저번에는 for문에 대해서 배웠습니다. 오늘은 while문에 대해 배워보도록 하겠습니다. while영어로 -하는 한 -하는 동안 이런뜻이죠? 그래서 뒤의 조건식이 참인한은 계속 루프를 돌려라 하는 뜻입니다. 예를 들어
while (i>1)
이렇게 하면 i가 1보다 큰한은 계속 루프를 돌려라 하는 뜻입니다. 저번에 for문으로 1에서 100까지 더하는 프로그램을 만들어봤는데 오늘은 while문으로 한번 만들어 보겠습니다. 조건식을 어떻게 주면 될까요? while (i<100) 이렇게 주면 되겠죠? i가 100보다 작은한은 계속 루프를 돌려라 그런 뜻이죠.
그다음에 저번에 배운 sum=sum+i 문을 넣어주면 되겠습니다. 그리고 한가지더 있는데 for문은 그 안에 증감문이 있습니다. i++이렇게요. 근데 while문은 문장 안에 증감문을 넣어 주어야 한다는 것이죠. 그러니까
while (i<100)
{ <-- 이건 while문의 시작이라는 뜻이구요.
i++ <- 이렇게요.
} <-- 이건 while문의 끝이라는 뜻입니다.
그럼 이제 작성하실수 있겠지요?
한번 만들어 봅시다.
<html>
<head>
<title>while문</title>
<script>
var i=0 <-- i가 0에서 시작합니다.
var sum=0 <-- sum합계도 0이지요.
while (i<100) <-- i가 100보다 작은한은 계속 돌립니다.
{ <-- while문의 시작
i++ <-- i를 1씩 증가시킵니다.
sum=sum+i; <-- sum에 합을 계속 누적해서 더합니다.
} <-- while문의 끝입니다.
document.write("1에서 100까지의 합은 : "+sum) <-- 결과를 출력합니다.
</script>
</head>
</html>
이렇게 만들면 되겠습니다. 이해안되시는 것은 댓글로 남겨주세요~
실행해보면
그럼 다음시간에 다시 만나요~~
'Java Script' 카테고리의 다른 글
| 함수의 기분구조와 alert내장함수 (0) | 2011.07.14 |
|---|---|
| do while문 - 자바스크립트 (0) | 2011.07.12 |
| 자바스크립트 - for문 (0) | 2011.07.08 |
| swith 문 (0) | 2011.07.06 |
| if문 (0) | 2011.07.04 |
글
자바스크립트 - for문
저번에는 switch문에 대해서 배워보았습니다. 오늘은 for문에 대해서 배워보겠습니다. for문은 루프문으로 루프문이라는 것은 계속 실행이 된다는 뜻입니다. 그래서 그 조건에 맞을때면 하염없이 계속 실행이 됩니다. 형식은
for (초기값;조건식;증감식)
입니다. 초기값은 예를들어 i=1 이렇게 하면 i라는 변수가 1에서 시작한다는 뜻입니다. 조건식에 i<=100이렇게 주면 i가 100보다 작거나 같을때까지 for문을 돌려라 하는 뜻입니다. 그다음에 증감식으로 i++이렇게 하면 i를 한번 실행시킬때마다 1씩 증가시켜라 하는 겁니다. ++은 그 변수를 하나 증가시키는 것입니다. --이렇게 하면 하나 감소시키는 거구요. (i++ : i가 3이었다면 4가 되지요. i-- : i가 5였다면 4가됩니다.)
그럼 형식이 어떻게 되겠습니까?
for (i=1;i<=100;i++)
이렇게 되겠지요? 해석해보면 변수 i가 1에서 시작해서 100보다 작거나 같을때까지 i를 1씩 증가시켜라 하는 내용입니다. 이해하셨죠?
자 그럼 위의 for문을 이용해서 1에서 100까지 숫자를 한번 더해보도록 하겠습니다. 어떤식으로 하면 될까요? 일단 sum이라는 변수 하나를 생각해봅시다. 총합을 구하는 변수지요. 1에서 100까지 더할려면 i의 값을 계속 sum에다가 더해주면 되겠지요? 그러니까 앞까지의 합에다가 현재의 i의 값을 더해주는 거지요.
합계 = 이전까지의 합계 + i
이렇게말이죠. 이것을 식으로 표현해보면
sum = sum + i
이렇게 됩니다. sum이 왜 두번 들어갔냐구요? 앞에 sum은 이전의 sum과 i의 합이고 뒤의 sum은 이전의 합입니다. 이해가 안되시면 아래를 보시죠.
sum = 0
for (i=1;i<=100;i++)
sum=sum+i;
자 최초의 sum(합계)는 0입니다. 즉 아무것도 안더한 값이죠. 그 다음에 i=1부터 시작하겠죠? 그럼 sum은 이전의 합계 0과 i,1의 합 즉
1=0+1
이렇게 되어서 1이 됩니다. 그 다음 for 문에서 i=2가 되겠죠. 그럼 sum은
sum = 1(이전까지의 합계) + 2(i의값)
이렇게 되어서 3이 됩니다. 또 for문에서 i=3이 되겠죠. 그럼 sum은
sum = 3(이전까지의 합계) + 3(i의 값)
이 됩니다. 이렇게 100까지 더하면 100까지 더한 값이 sum에 저장이 됩니다. 이해하시겠지요?
그럼 소스를 한번 만들어 봅시다.
<html>
<head><title>IMG링크걸기</title>
<script>
sum = 0
for (i=1;i<=100;i++)
sum = sum + i;
document.write("1에서 100까지의 합은 : "+sum);
</script>
</head>
</html>
실행해보면,
이렇게 답이 나오죠? 지금까지 for문에 대해서 했습니다. 어떠셨나요? 쉬웠나요? 어려웠나요? 이전보다는 좀 어려우셨으리라 봅니다. 그러나 지금부터 시작입니다. 힘내서 같이 또 해나갑시다!
'Java Script' 카테고리의 다른 글
| do while문 - 자바스크립트 (0) | 2011.07.12 |
|---|---|
| while문 (0) | 2011.07.10 |
| swith 문 (0) | 2011.07.06 |
| if문 (0) | 2011.07.04 |
| 변수선언 (0) | 2011.06.29 |
