콜백함수 callback function
함수의 매개변수에 함수를 인수로 전달하는 것.
<script>
function addFn(num1, num2) {
num1(); // 인수로 받은 num1 함수를 호출
num2(); // 인수로 받은 num2 함수를 호출
}
//화살표 함수
const fn1 = () => console.log(`num1의 인수가 될 fn1 함수입니다.`);
// 함수 선언문
function fn2() {
console.log(`num2의 인수가 될 fn2 함수입니다.`);
}
// 함수 표현식
const fn3 = function() {
console.log(`num2의 인수가 될 fn3 함수입니다.`)
}
addFn(fn1, fn2);
//addFn함수에 fn1, fn2 함수를 각 num1, num2에 인수로 넘겨 호출
addFn(fn1, fn3);
//addFn함수에 fn1, fn3 함수를 각 num1, num2에 인수로 넘겨 호출
</script>
자바스크립트 내장 함수
setTimeout(콜백함수, 시간);
일정 시간 후 한 번만 실행하는 자바스크립트 내장 함수로 '호출 스케줄링'이라고 한다.
const working = () => {
let study = `자바스크립트`;
setTimeout(function() {
console.log(`재미있는 ${study}`);
}, 2000) // css: 1초 == 1s / js: 1초 == 1000
}
working();
// 2초 후 '재미있는 자바스크립트' 출력
clearTimeout();
setTimeout()을 중단하는 함수로, setTimeout()을 변수에 대입해서 사용하고 그 식별자를 ()안에 작성하면 된다.
<!DOCTYPE html>
<html lang="ko">
<head>
<title>setTimeout()</title>
</head>
<body>
<script>
setTimeout(() => {
console.log(`6초 후 실행`);
}, 6 * 1000);
const once = setTimeout(() => {
console.log(`2초 후 실행`);
}, 2000);
// clearTimeout(); setTimeout() 중단
clearTimeout(once); // once함수의 `2초 후 실행`은 실행되지 않음.
</script>
</body>
</html>
setInterval(콜백함수, 시간);
지정된 시간마다 함수 반복 실행
2초마다 n번째 실행되는 setInterval() 함수.
<!DOCTYPE html>
<html lang="ko">
<head>
<title>setInterval()</title>
</head>
<body>
<script>
let count = 1;
setInterval(() => {
console.log(`2초마다 ${count++}번째 실행`);
}, 2000);
</script>
</body>
</html>
화살표 함수로 작성해서 콜백 함수로도 사용 가능하다.
const write = () => document.body.innerHTML += `<p>setInterval() 호출</p>`;
const isLoop = setInterval(write, 2000);clearInterval()
setInterval()를 중단하는 함수.
const write = () => document.body.innerHTML += `<p>setInterval() 호출</p>`;
const isLoop = setInterval(write, 2000);
setTimeout(() => {
clearInterval(isLoop);
}, 5000);'JavaScript' 카테고리의 다른 글
| [JavaScript] JSON (0) | 2022.12.05 |
|---|---|
| [JavaScript] 객체 (Object) (0) | 2022.12.02 |
| [JavaScript] 중첩 함수/ 내부 함수 (0) | 2022.12.02 |
| [JavaScript] 즉시 실행 함수 (0) | 2022.12.02 |
| [JavaScript] 지역 변수 / 전역 변수 (scope) (0) | 2022.12.02 |