- 함수란?
- 함수정의
function 이란는 키워드를 사용하여 함수를 정의 할수 있다.
function 함수이름(매개변수1,2,3.....) {
문장
}함수이름은 변수이름과 동일한 방법으로 만들어야 하며,매개변수의 수는 제한이 없고 매개변수 간에는
콤마(,)로 구분해야 한다매개변수가 없는 경우 예 설명 function mirage(){
window.open("a.html","","")
}
mirage 라는 함수명 안에 매개변수를 사용하지 않은 예이다. 매개변수가 있는 경우 예 설명 function mirage(home1){
document.write(" " + home1 + " ")
}
mirage함수에 home1이라는 매개변수가 들어간 경우이다.
리턴값이 있는 경우 예 설명 function mirage(str){
com2 = confirm("hom1")
return com2
}
사용자가 입력한 값을 com2라는 변수에 담아서 mirage함수에 리턴값으로 보내는 경우이다.
confirm은 다이얼로그 박스를 띄워서 확인 취소를 물어보는 자바 스크립트 내장함수이다.
hom1은 다이얼로그 박스 안내문 이다.
확인은 true, 취소는 false가 리턴된다.
- 내장함수
선언해서 만들은게 아니라 이미 만들어져서 자바 스크립트에 내장되어 있는 함수이다.
가져다가 사용 하기만 하면 된다.- alert
- confirm
다이얼로그 박스를 띄워 확인 취소에 따라 결과값을 리턴해 주는 함수이다confirm("선택 하시겠습니까") - prompt
사용자 입력창을 띄워 결과값을 리턴해 주는 함수이다prompt("입력값","초기값")
입력값:계산할 수식을 입력해 주세요
초기값을 지정하면 undefined글자 대신에 지정한 값이 입력된다.
위그림은 초기값 지정을 안한 상태이다. - eval
문자열로 입력된 수식을 계산 해주는 내장함수이다.
입력양식을 통해 입력된 값을 계산할때 아주 유용하다.예제1 실행화면 <script language="javascript">
<!--
var mirage3
mirage3 = prompt("계산할 수식을 입력해 주세요")
document.write("입력한 값 : " + mirage3 + "
")
document.write("실행결과 : " + eval(mirage3) + "
")
//끝 -->
</script>
<INPUT onfocus="this.blur()" onclick="coun()" type="button" value="실행하기"> - parseInt
문자열을 정수로 변환해주는 자바스크립트 내장함수이다.parseInt(string,nbase)
string에는 변환할 문자열을 입력하고 nbase에는 변환할 정수형태를 지정한다.
string매개변수 안에 일반문자가 들어가 있다면 문자앞에 있는 숫자 까지만 적용이되고
되에있는 문자나 숫자는 모두 무시된다.예제2 실행화면 <script>
var mirage7
mirage7 = prompt("변환할 숫자를 입력하세요.")
document.write("입력한 값 : " + mirage7 + "<br>");
document.write("실행결과 : " + parseInt(mirage7,16) + "<br>");
</script>
<INPUT onfocus="this.blur()" onclick="coun3()" type="button" value="실행하기"> 위의 예제는 입력한 값을 16진수 값으로 출력합니다.
- parseFloat
문자열을 부동소수점으로 변환해 준다.parseFloat(string) F는 꼭 대문자로 써야한다
farseFloat은 2진수나 8진수가 없기때문에 nbase는 존재하지 않는다.
예제3 실행화면 <script language="javascript">
<!--
var mirage7
mirage7 = prompt("부동소수점으로 변환할 숫자를 입력하세요.")
document.write("입력한 값 : " + mirage7 + "<br>");
document.write("실행결과 : " + parseFloat(mirage7) + "<br>");
// end -->
</script><INPUT onfocus="this.blur()" onclick="coun2()" type="button" value="실행하기"> - escape
ISO-Latin-1 문자셋을 ASCII형태로 바꾸어 리턴해 주는 함수이다
리턴값은 %??형태로 나오게 된다.예제4 실행화면 <script language="javascript">
<!--
document.write("& = "+ escape('&')+"<br>");
document.write("^ = "+ escape('^')+"<br>");
// end -->
</script>
& = %26
^ = %5E
- unescape
ASCII형태를 ISO-Latin-1 문자셋으로 바꾸어 리턴해주는 함수이다.예제5 실행화면 <script language="javascript">
<!--
document.write("%13 = "+ unescape('%13')+"<br>");
document.write("%c7 = "+ unescape('%c7')+"<br>");
// end -->
</script>
%13 =
%c7 = Ç
기타 많은 내장함수가 있다.....!
경고창을 띄워 주는 내장함수이다
확인=true, 취소=false 가 리턴된다.alert("mirage728홈 방문을....") - 함수호출
함수를 만들어 놓고 호출을 해야 실행이 되는 함수가 있고 브라우저가 문서를 읽어 들일때
바로 실행이 되는 함수도 있다.함수호출: 함수명()
호출하는 방법은 여러가지가 있다.
그중에 자주 쓰이는 예)예제6 실행화면 <script>
function mirage9() {
alert("함수가 호출됐습니다");
return;
}
</script>
<a href="javascript:mirage9()">호출하기1</a>
<a onclick="mirage9()">호출하기2</a>
<body onload=mirage9()> ← 호출하기3
호출하기1 ↑커서만들려면: style="cursor:hand;"
넣어주면 된다
링크안에 함수 호출문이 있어서 클릭하면 곧장 함수가 실행된다.
브라우저가 문서를 읽어 들일때 실행 하려면 정의된 함수명을 삭제하고
내장함수만 사용하든가 아니면 <body onload=mirage9()> 형태로 사용 할 수도 있다- 재귀적 호출
함수가 내부에서 자기 자신을 호출하는 것이다.
예제7 실행화면 <script language="javascript">
<!--
function fac(mirage) {
if(mirage >1 ) {
var resu
resu = mirage*fac(mirage-1)
return resu
}
else {
return mirage
}
}
// -->
</script><script language="javascript">
<!--
var mirage
mirage = prompt
("수의 계승을 구할 정수을 입력하세요")
document.write("<h4>" + mirage + "의 계승 = "
+ fac(mirage) + "</h4>")
// -->
</script>
첫번째 스크립트는 계승(factorial)구하는 공식이다.
계승이란 수의 값을 줄여가며 곱해주는
계산식 이다. 7! = 7*6*5*4*3*2*1먼저 함수 fac를 선언하고 매개변수로 mirage를
지정해주었다
if문으로 매개변수(앞으로 입력 받을값)의 범위를 지정하고 있는데 1보다 크면 문장을 실행하고 1이거나 1보다 작으면 입력받은 값을 그대로 리턴값으로 돌리고 있다
결과값을 저장할 변수를 resu로 만들어 주었다. resu에는 입력값(mirage) 곱하기 (입력값-1)한 값이 들어가는데 입력값-1을 매개변수로 fac함수를 호출하고 있다.
이유는 조건을 검사하기 위해서 이다
(1이면 결과값을 리턴하고 if문을 벗어나야 하니까)
mirage-1값이 1이 될때까지 계속 fac함수를 호출하게 된다.
밑에 문장(return resu)은 실행 할 수도 없다 계속 함수 호출문에 걸리니까
1이되면 resu(계산한 값이 들어있다)를 리턴값으로 돌려준후 if문을 끝내게 된다.두번째 스크립트는 입력을 받고 출력시키기 위한 스크립트로 계산은 위에 있는 스크립트가 한다
prompt 내장함수로 값을 입력 받아서 mirage라는 변수에 넣어주고 있다
mirage라는 변수에는 사용자가 입력한 값이 들어가게 된다
그 값을 매개변수로 fac함수를 호출해서 출력시키고 있다.
" "안에 있는 모든 값들은 그대로 출력되고 밖에 있는 문자는 값을 가지고 있는 변수또는 함수라고 생각하면 될 것이다 "" 와 계산값(변수,함수리턴값..등등)은 + 기호로 연결해 주면 된다. 중요한 점은 변수나 함수를 " "안에 넣어주면 문자로 인식하기 때문에 실행이 안되고 그냥 출력되어 버린다<INPUT onfocus="this.blur()" onclick="coun4()" type="button" value="실행하기">
조금더 간단하게 표현 한다면.....!
예제8 실행화면 <script>
function fact(n){
if(n == 1)
return(1)
else
return(n*fact(n-1))
}
</script>
<script language="javascript">
<!--
var mirage
mirage = prompt("수의 계승을 구할 정수을 입력하세요")
document.write("<h4>" + mirage + "의 계승 = " + fact(mirage) + "</h4>")
// -->
</script>
<INPUT onfocus="this.blur()" onclick="coun5()" type="button" value="실행하기"> 예제9 실행화면 재귀적 호출의 완결판 문제!
3개의 막대와 n개의 서로다른 크기의 접시가 있다.
접시에는 가운데 구멍이 나서 막대에 꽂을수가 있는데 왼쪽막대에 크기 순으로 작은것은 위에
큰것은 밑에 차례대로 꽂혀있다.
이접시를 모두 맨오른쪽 막대에 옮기되 한번에 하나씩 옮겨야 하며 작은 접시를 큰 접시에
놓을순 있지만 큰 접시를 작은접시 위에 놓을 수 는 없다.
가운데 막대는 잠시 옮겨놓는 장소로 사용 할 수 있다.문제)접시의 갯수를 n이라 할때 n개 접시를 옮기는 프로그램을 작성하시오.
참고) 접시갯수(n)에 따른 옮기는 횟수는 (2에n승-1)로 증가하기 때문에 너무 큰수는 컴퓨터로 계산해도 시간이 엄청 걸립니다. 결과를 확인할때 15 이하로 입력하세요..^^
<INPUT onfocus="this.blur()" onclick="coun6()" type="button" value="결과 보기">[출처] [3]자바스크립트 함수|작성자 붉은매
프로그램 내에서 특정 작업을 수행하기 위해 작업을 하나의 단위로 만들어 반복적으로 사용 할 수 있게
한 것이다.