1. 기본 콜백 함수
콜백 함수란 함수를 함수에서 불러 사용하는것이다.
다른 함수를 불러와서 사용 하기 때문에, 인풋 변수에 함수가 들어가는 것이 특징이다.
helloFunction 이라는 함수를 getFunction 함수에서 호출 할 수 있다.
소스 코드
function helloFunction() {
console.log("함수 호출");
}
function getFunction(callback) {
callback();
}
getFunction(helloFunction);
getFunction(function () {
console.log("익명 함수 호출");
});
결과
getFunction 함수는 함수를 넣어서 사용하기 때문에, 익명함수도 사용 가능합니다.
(익명함수는 함수의 이름이 없기 때문에, 일회용 함수)
예제에서는 콜백함수를 큰 목적없이 사용했지만, 다른 함수를 사용하기 위한 조건들이나 로직들을 함수에 구현해 준다면 유용하게 사용할 수 있습니다.
2. 매개 변수 포함된 콜백함수
콜백함수는 매개변수를 받아서 호출할수 있도록 작성 할 수 있다.
매개 변수가 없는 콜백함수와 차이는 없지만, 한번 예제를 따라 해보도록 하자
소스 코드
function helloFunction(text) {
console.log(text);
}
function getFunction(callback) {
var text = "콜백 함수를 거치게 되면 텍스트가 추가됩니다.";
callback(text);
}
getFunction(helloFunction);
getFunction(function (str) {
console.log(str + "(익명함수)");
});
결과
3. setTimeout, setInterval 콜백함수
자바 스크립트에서 제공하는 콜백함수이다.
setTimeout : 설정 시간이 지나면 함수 호출한다.
setInterval : 설정 시간을 주기마다 함수를 호출한다.
3-1) setTimeout 예제
3-2) setInternal 예제
'Front-End > 자바스크립트' 카테고리의 다른 글
JSON - 자바스크립트의 객체와 비교 (0) | 2021.08.03 |
---|---|
[자바스크립트(Java Script)] 비동기 간단 예제 (0) | 2021.08.02 |
[자바스크립트(Java Script)] 객체 간단 예제(2) (0) | 2021.05.07 |
[자바스크립트(Java Script)] 객체 간단 예제(1) (0) | 2021.05.07 |
[자바스크립트(Java Script)] 리스트 생성 예제 (0) | 2021.05.07 |