본 수업은 폐지 예정입니다. 자바스크립트 언어 수업과 웹브라우저 자바스크립트로 수업이 리뉴얼 되었기 때문에 이것을 이용해주세요.
함수(function, method)
- 일련의 로직을 다시 사용할 수 있도록 묶어둠(모듈화) - 개발자의 미덕은 게으름
- 입력(인자,argument)와 출력(반환,return)으로 이루어짐
- 사용자 정의 함수와 내장함수가 있다.
문법
- 함수의 정의는 다음과 같이 한다.
- 함수명은 함수를 호출할 때 사용할 이름(함수는 변수에 저장된다)
- 인자는 함수에 저장되는 변수. 콤마로 구분되고 없을 수도 있고 무한히 많을수도 있다.
- return은 함수가 결과값으로 출력할 값. return은 함수의 종료조건이 됨
1 2 3 4 5 | function 함수명(인자명1, 인자명2...) { // 로직 return 반환값;} |
- 함수의 호출은 다음과 같이 한다.
1 | 함수명(인자값, 인자값....); |
예제
example1.html - (jsfiddle, github)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" > <script> function test(x, y) { var z = x + y; return z; } alert(test(1, 2)); // 3을 출력함 </script> </head></html> |
example2.html - (jsfiddle, github)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" > <script type="text/javascript"> function sum(num1, num2) { return num1 + num2; } </script> </head> <body> <form> <input type="button" onclick="alert(sum(1,1))" value="1+1" /> <br /> <input type="button" onclick="alert(sum(1,2))" value="1+2" /> <br /> <input type="button" onclick="alert(sum(1,3))" value="1+3" /> <br /> <br /> <br /> <input type="text" onchange="alert(sum(10,Number(this.value)))" /> +10 </form> </body></html> |
