본 수업은 폐지 예정입니다. 자바스크립트 언어 수업과 웹브라우저 자바스크립트로 수업이 리뉴얼 되었기 때문에 이것을 이용해주세요.
함수(function, method)
- 일련의 로직을 다시 사용할 수 있도록 묶어둠(모듈화) - 개발자의 미덕은 게으름
- 입력(인자,argument)와 출력(반환,return)으로 이루어짐
- 사용자 정의 함수와 내장함수가 있다.
문법
- 함수의 정의는 다음과 같이 한다.
- 함수명은 함수를 호출할 때 사용할 이름(함수는 변수에 저장된다)
- 인자는 함수에 저장되는 변수. 콤마로 구분되고 없을 수도 있고 무한히 많을수도 있다.
- return은 함수가 결과값으로 출력할 값. return은 함수의 종료조건이 됨
function 함수명(인자명1, 인자명2...) {
// 로직
return 반환값;
}
- 함수의 호출은 다음과 같이 한다.
함수명(인자값, 인자값....);
예제
example1.html - (jsfiddle, github)
<!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)
<!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>
