개발바닥

재귀 함수와 콜백 함수 본문

자바스크립트

재귀 함수와 콜백 함수

라이언 2019. 2. 4. 23:24
반응형

재귀 함수란?

함수 내에서 자신을 다시 호출하는 함수를 말한다.

재귀 함수를 사용할 때는 조심스럽게 사용을 해야된다.

그 이유는 잘못된 값을 적용하거나 조건을 제대로 적용을 안했다면 무한 루핑을 발생시켜 시스템을 다운시키기 때문이다.

그러므로 재귀 함수 사용시에는 꼭 필요하거나 정확한 이해가 필요하다..



<!DOCTYPE html>
<html>
<head>
<script>
function count(x){
if(x==0){
document.write("함수 실행 종료");
}else{
document.write("함수 count가 호출될 때의 x값 :" + x+"<br>");
count(x-1);
}
}
</script>
</head>
<body>
<h2>재귀 함수 호출하기</h2>
<script>
count(5);
</script>
</body>
</html>


결과 화면



콜백 함수란?

자바스크립트는 함수를 변수로 저장(함수 표현식)할 수 있기 때문에 함수 표현식에 의한 변수를 함수의 인수로 사용하여 매개변수에 전달할 수 있다.

이때 함수의 매개변수에 전달되는 함수 표현식의 변수인 인수를 콜백 함수라고 한다.

콜백 함수가 많이 적용되는 경우는 보통 자바스크립트에서 웹 페이지가 서버로부터 데이터를 수신하기 위해서 AJAX(Asynchronous JavaScript and XML)를 사용할 때이다. 콜백 함수는 주로 비동기식으로 적용된다. 콜백 함수는 코드를 통해 명시적으로 호출하는 함수가 아니라, 개발자는 단지 함수를 등록하기만 하고, 어떤 이벤트가 발생했거나 특정 시점에 도달했을 때 시스템에서 호출되는 함수를 말한다.



<!DOCTYPE html>
<html>
<head>
<script>
function callback(x){
for(var i=1;i<=10;i++){
x(i);
}
}
var grt=function(i){
document.write('hello , '+i+'<br>');
}
</script>
</head>
<body>
<script>
callback(grt);
</script>
</body>
</html>



결과 화면


또 다른 콜백 함수 예시로 하나 더 확인해 보겠습니다.



<!DOCTYPE html>
<html>
<head>
<script>
function cmp1(a,b){
return b-a;
}
function cmp2(a,b){
return a-b;
}
</script>
</head>
<body>
<script>
var scores=[10,50,23,14,25,34,18,9];
document.write('내림차순 : '+scores.sort(cmp1));
document.write('<br><br>');
document.write('오름차순 : '+scores.sort(cmp2));
</script>
</body>
</html>


결과 화면


콜백 함수를 sort()함수의 비교 연산으로 사용할 수 있다.

이때 적용된 'cmp' 가 콜백 함수입니다.



반응형

'자바스크립트' 카테고리의 다른 글

내장 함수  (0) 2019.02.05
자바스크립트 기본 개념  (0) 2018.12.17
Node.js 설치  (0) 2018.12.17
'자바스크립트' Related Articles more
Comments