일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 30 | 31 |
- 함수 객체의 프로퍼티
- css
- python
- 한글 입력 시 이벤트 두 번 발생
- 최소공배수
- float: right
- 동적 계획법
- 백준
- __proto__ 접근자 프로퍼티
- 알고리즘
- 동기
- javascript
- backtracking
- 메타버스
- 백트래킹
- 9610
- prototype 프로퍼티
- 파이썬
- dp
- 백준 9610번 파이썬 문제 풀이
- C++
- Tanstack Query
- 유클리드 호제법
- 프로그래밍
- 비동기
- 낙관적 업데이트
- 2522
- 시간
- 자바스크립트
- 한글이 두 번 입력됨
- Today
- Total
염딩코
콜백 함수란? (Callback function) 본문
![](https://t1.daumcdn.net/keditor/emoticon/friends1/large/009.gif)
콜백 함수(Callback Function)는 함수를 매개변수로 받아들여 다른 함수 내에서 실행되는 함수입니다. 이는 JavaScript에서 비동기 프로그래밍을 가능하게 하는 핵심적인 개념 중 하나입니다.
예를 들어, JavaScript에서 setTimeout() 함수는 일정 시간이 지난 후에 함수를 실행합니다. 이 함수는 첫 번째 매개변수로 실행할 함수를 받고, 두 번째 매개변수로 지연 시간(밀리초)을 받습니다. 이때, 첫 번째 매개변수로 전달하는 함수는 콜백 함수입니다.
setTimeout(() => {
console.log('Hello, world!');
}, 1000);
위 예제에서는 setTimeout() 함수가 1초(1000밀리초) 후에 실행되고, 첫 번째 매개변수로 전달된 함수가 실행됩니다. 이 함수는 console.log()를 호출하여 "Hello, world!"를 출력합니다.
콜백 함수는 이와 같은 비동기적인 작업에서 자주 사용됩니다. 다른 예로는 fetch() 함수를 들 수 있습니다. 이 함수는 서버로부터 데이터를 가져오는 비동기적인 작업을 수행하며, 데이터가 로드되면 첫 번째 매개변수로 전달된 콜백 함수가 실행됩니다.
fetch('https://jsonplaceholder.typicode.com/todos/1')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
위 예제에서는 fetch() 함수가 JSON 데이터를 가져오는 비동기적인 작업을 수행합니다. 이 함수는 Promise를 반환하며, then() 메소드를 사용하여 데이터를 처리하고, catch() 메소드를 사용하여 오류를 처리합니다. 이때, 첫 번째 then() 메소드로 전달된 함수와 catch() 메소드로 전달된 함수는 콜백 함수입니다.
콜백 함수는 JavaScript에서 매우 중요한 개념 중 하나입니다. 이를 사용하면 비동기적인 작업을 보다 쉽게 처리할 수 있으며, 프로그래머가 코드를 보다 구조화하고 유지보수하기 쉽게 만듭니다.
'Front-End > Javascript' 카테고리의 다른 글
[JS] Prototype (0) | 2023.07.31 |
---|---|
[JS]let, const 키워드와 블록 레벨 스코프 (0) | 2023.07.29 |
[JS]전역 변수의 문제점 (0) | 2023.07.29 |
[JS] 블로킹과 논블로킹 / 동기와 비동기 (0) | 2023.07.27 |
Optional Chaining(옵셔널 체이닝)이란? (0) | 2023.03.07 |