콜백 함수(callback function)는 다른 함수에 전달되어 실행되는 함수입니다. JavaScript에서 함수는 일급 객체이므로 다른 함수에 인자로 전달되고, 반환 값으로 사용될 수 있습니다. 이 때, 전달되는 함수를 콜백 함수라고 합니다.
콜백 함수는 비동기 작업에서 자주 사용됩니다. 비동기 작업은 일반적으로 시간이 걸리거나 외부 요청(예: 서버 요청, 파일 읽기 등)과 관련이 있으며, 작업이 완료되는데 시간이 걸릴 수 있습니다. 이러한 비동기 작업이 끝난 후에 실행할 작업을 콜백 함수로 전달하여 처리할 수 있습니다.
예를 들어, setTimeout 함수는 일정 시간이 지난 후에 콜백 함수를 실행하는 함수입니다:
```javascript
function myCallback() {
console.log("This is a callback function!");
}
setTimeout(myCallback, 1000); // 1초 후에 myCallback 함수가 실행됨
```
위의 코드에서 `myCallback` 함수가 콜백 함수로 사용되었습니다. `setTimeout` 함수는 1초 후에 `myCallback` 함수를 실행합니다. 이처럼 콜백 함수를 사용하면 비동기적인 작업의 완료를 처리하거나, 특정 이벤트가 발생했을 때 실행할 작업을 정의할 수 있습니다.
콜백 함수는 함수의 매개변수로도 사용될 수 있습니다. 예를 들어, 배열의 각 요소를 처리하는 `Array.forEach()` 메서드의 경우에도 콜백 함수를 사용합니다:
```javascript
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
console.log(number);
});
```
위의 코드에서 `forEach` 메서드의 인자로 전달된 익명 함수가 콜백 함수로 사용되었습니다. 이 콜백 함수는 배열 `numbers`의 각 요소를 처리하고 출력합니다.
콜백 함수는 비동기 작업뿐만 아니라 여러 상황에서 유용하게 사용될 수 있으며, JavaScript에서 많이 활용되는 개념 중 하나입니다.
'┝ 개발 언어 > ┝ html_css_js' 카테고리의 다른 글
객체 분해(destructuring) 구문 (0) | 2023.10.05 |
---|---|
[js] promise란 (0) | 2023.07.26 |
script 태그 안의 async란 (0) | 2023.07.07 |
js await와 async (0) | 2023.06.29 |
타입스크립트 화살표 함수 정리 (0) | 2023.06.27 |