반응형
자바스크립트는 파라미터의 수를 체크하지 않는다.
argstest.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>arguments객체</title>
</head>
<body>
<pre>
<script type="text/javascript">
function showMessage(value) {
document.writeln(value);
}
showMessage();
showMessage('홍길동');
showMessage('홍길동', '이순신');
</script>
</pre>
</body>
</html>
|
cs |
첫 번째 호출 : value값은 undefined
두 번째 호출 : value값은 '홍길동'
세 번째 호출 : value값은 '홍길동' 이며 '이순신' 값은 사용하지 않았다.
arguments객체는 함수 호출 시 전달된 모든 인자가 저장된다.
위와 같은 예제에서 인수 개수가 다를 경우 에러를 보여주고 싶은 경우 다음과 같이 가능하다.
argsChecktest.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>arguments객체</title>
</head>
<body>
<pre>
<script type="text/javascript">
function showMessage(value) {
if(arguments.length != 1){
throw new Error('인수의 수가 틀립니다.：' + arguments.length);
}
document.writeln(value);
}
try {
showMessage('홍길동', '이순신');
} catch(e) {
window.alert(e.message);
}
</script>
</pre>
</body>
</html>
|
cs |
디폴트 인자 설정
자바스크립트는 모든 인수에 대해 생략이 가능함.
따라서 필요한 경우 기본 인자를 설정할 필요도 있다.
defaulttest.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>인수의 디폴트 값</title>
</head>
<body>
<pre>
<script type="text/javascript">
function triangle(base, height) {
if (base == undefined) { base = 1; }
if (height == undefined) { height = 1; }
return base * height / 2;
}
document.writeln(triangle(5));
</script>
</pre>
</body>
</html>
|
cs |
위 예제에서 base에 인수를 전달하지 않고 height에만 전달할 수는 없다.
모든 인자는 왼쪽 변수부터 채우도록 동작하기 때문이다.
가변인자
함수 정의 시 인자의 개수가 정해지지 않는 함수의 인자
variableArgs1test.html
|
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
26
27
28
29
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>arguments객체</title>
</head>
<body>
<pre>
<script type="text/javascript">
function sum() {
var result = 0;
for (var i = 0; i < arguments.length; i++) {
var tmp = arguments[i];
if (isNaN(tmp)) {
throw new Error('지정값이 숫자가 아닙니다.：' + tmp);
}
result += tmp;
}
return result;
}
try {
document.writeln(sum(1, 3, 5, 7, 9));
} catch(e) {
window.alert(e.message);
}
</script>
</pre>
</body>
</html>
|
cs |
명시된 인자와 가변인자를 혼합하여 정의
variableArgs2test.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>arguments객체</title>
</head>
<body>
<pre>
<script type="text/javascript">
function printf(format) {
for (var i = 1; i < arguments.length; i++) {
var pattern = new RegExp('\\{' + (i - 1) + '\\}', 'g');
format = format.replace(pattern, arguments[i]);
}
document.writeln(format);
}
printf('안녕하세요、{0}씨. 나는 {1}입니다.', '홍길동', '이순신');
</script>
</pre>
</body>
</html>
|
cs |
이름이 없는 인자는 최소한으로 사용하도록 권장한다.
위의 예제와 같이 arguments객체로 접근하는 것 보다는 이해하기 쉬운 문자를 이름으로 사용하는 것이 의미 이해에 더 유리하기 때문이다.
재귀호출
calleetest.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>arguments객체</title>
</head>
<body>
<pre>
<script type="text/javascript">
function factorial(n) {
if (n != 0) { return n * arguments.callee(n - 1); }
return 1;
}
document.writeln(factorial(5));
</script>
</pre>
</body>
</html>
|
cs |
argument.callee는 함수 내에서 함수 자신을 나타내는 속성이다.
반응형
'교육자료 > Javascript' 카테고리의 다른 글
| 16-1. 자바스크립트의 객체 지향 특성 (0) | 2019.05.13 |
|---|---|
| 15-5. 자바스크립트 함수의 활용 (0) | 2019.05.09 |
| 15-3. 변수의 범위 (0) | 2019.05.09 |
| 15-2. 함수 사용 시 주의 (0) | 2019.05.09 |
| 15-1. 자바스크립트 함수 (0) | 2019.05.09 |