반응형
콜백 함수 란?
콜백(Callback) 함수는 간단히 말하면 매개변수로 함수 객체를 전달해서 호출 함수 내에서 매개변수 함수를 실행하는 것
function sayHello(name, callback) {
const words = '안녕하세요 내 이름은 ' + name + ' 입니다.';
callback(words); // 매개변수의 함수(콜백 함수) 호출
}
sayHello("인파", function printing(name) {
console.log(name); // 안녕하세요 내 이름은 인파 입니다.
});
즉, 콜백 함수란 파라미터로 일반적인 변수나 값을 전달하는 것이 아닌 함수 자체를 전달하는 것을 말한다고 보면 된다. 또한 어차피 매개변수에 함수를 전달해 일회용으로 사용하기 때문에 굳이 함수의 이름을 명시할 필요가 없어 보통 콜백 함수 형태로 함수를 넘겨줄때 함수의 이름이 없는 '익명 함수' 형태로 넣어주게 된다.
function sayHello(name, callback) {
const words = '안녕하세요 내 이름은 ' + name + ' 입니다.';
callback(words);
}
sayHello("인파", function (name) { // 함수의 이름이 없는 익명 함수
console.log(name);
});
콜백 지옥 (Callback Hell)
함수의 매개변수로 넘겨지는 콜백 함수가 반복되어 코드의 들여쓰기 수준이 감당하기 힘들어질 정도로 깊어지는 현상이다.
function add(x, callback) {
let sum = x + x;
console.log(sum);
callback(sum);
}
add(2, function(result) {
add(result, function(result) {
add(result, function(result) {
add(result, function(result) {
add(result, function(result) {
add(result, function(result) {
add(result, function(result) {
add(result, function(result) {
add(result, function(result) {
console.log('finish!!');
})
})
})
})
})
})
})
})
})
그러니까 뭐든 적당히 사용해야 한다.
반응형
'WEB > JavaScript' 카테고리의 다른 글
[JS] 재귀 함수 (0) | 2023.10.28 |
---|---|
[JS] 비동기 (0) | 2023.10.24 |
[JS] 즉시실행함수(IIFE) (0) | 2023.10.24 |
[JS] 매개변수 패턴 (0) | 2023.10.24 |
[JS] 함수 선언식 vs 함수 표현식 (0) | 2023.10.24 |