1. Callback 함수
- 다른 함수의 매개변수로 전달되어 그 함수 내에서 호출되는 함수
- 파라미터로 함수를 받아와서 callback으로 함수 호출
- 함수 내에서 함수 외부에 있는 다른 함수를 가져와서 호출하려면 콜백 함수를 사용
- 함수를 다른 함수의 인자로 전달하여 그 함수 내에서 필요한 시점에 호출하는 방식
- 익명 함수, 선언적 함수 모두 callback 함수로 사용 가능
1) 익명 함수로 callback 함수 정의
callThreeTimes 함수의 인자로 전달되는 함수
"callThreeTimes" 함수를 선언하고, 그 함수를 호출할 때 사용되는 함수가 바로 콜백 함수
- 즉, callThreeTimes 함수를 선언하고 그 함수를 callback으로 호출한다는 것
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
// callback 함수 : 파라미터로 함수를 받아와서 callback으로 함수 호출
function callThreeTimes(callback){
for(let i=0;i<3;i++)
callback(i);
}
// 익명 함수로 callback 호출하기
callThreeTimes(function(i){
console.log(`${i}번째 함수 호출 - 익명함수`);
});
</script>
</head>
<body>
</body>
</html>
2) 선언적 함수로 callback 함수 정의
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
//callback: 함수 이용 / GUI 이벤트 시 주로 사용함
function callThreeTimes(callback){
for(let i=0; i<3; i++)
callback(i);
}
// 선언적 함수로 callback함수 정의
function print(i){
console.log(`${i}번째 함수 호출`);
}
callThreeTimes(print);
</script>
</head>
<body>
</body>
</html>
'공부(TIL) > Javascript' 카테고리의 다른 글
window.innerWidth (0) | 2025.01.13 |
---|---|
[프로그래머스] 기초 Day1 (0) | 2024.08.24 |
forEach문 (0) | 2024.03.13 |