JavaScript에서 콜백 함수를 더 잘 이해하기


3 Answers

콜백이 존재하고 실행 가능한 함수인지 확인해야합니다.

if (callback && typeof(callback) === "function") {
    // execute the callback, passing parameters as necessary
    callback();
}

많은 라이브러리 (jQuery, dojo 등)는 비동기 함수에 대해 비슷한 패턴을 사용하고 모든 비동기 함수에 대해 node.js를 사용합니다 (nodej는 일반적으로 콜백에 errordata 를 전달 error ). 그들의 소스 코드를 살펴보면 도움이 될 것입니다!

Question

다른 함수에 콜백 함수를 전달하고 실행하는 것을 이해합니다. 그러나이를 수행하는 최선의 구현을 이해하지 못합니다. 나는 다음과 같은 아주 기본적인 예제를 찾고있다.

var myCallBackExample = {
    myFirstFunction : function( param1, param2, callback ) {
        // Do something with param1 and param2.
        if ( arguments.length == 3 ) {
            // Execute callback function.
            // What is the "best" way to do this?
        }
    },
    mySecondFunction : function() {
        myFirstFunction( false, true, function() {
            // When this anonymous function is called, execute it.
        });
    }
};

myFirstFunction에서 새로운 콜백 ()을 반환하면 익명 함수가 작동하고 실행되지만 올바른 방식이 아닌 것 같습니다.




당신은 자바 스크립트에서 콜백 함수를 설명하는 기본 예제를 추가하는이 링크를 살펴볼 수 있습니다. jsfiddle

var x=0;

function testCallBack(param1, param2, callback) {
    alert('param1= ' + param1 + ', param2= ' + param2+' X='+x);
    if (callback && typeof(callback) === "function") {
        x+=1;
        alert("Calla Back x= "+x);
        x+=1;
        callback();
    }
}


testCallBack('ham', 'cheese',function(){
alert("Function X= "+x);
});



콜백은 신호에 관한 것이고 "새로운"은 객체 인스턴스 생성에 관한 것입니다.

이 경우 "callback ();"을 실행하는 것이 더 적절합니다. 어쨌든 반환 값을 가지고 아무것도하지 않기 때문에 "new callback ()"을 반환하십시오.

(그리고 arguments.length == 3 테스트는 정말로 까다롭기 때문에 콜백 매개 변수가 있는지 확인하는 것이 더 좋습니다.




당신이 사용할 수있는:

if (callback && typeof(callback) === "function") {
    callback();
}

아래 예제는 좀 더 포괄적입니다.

function mySandwich(param1, param2, callback) {
alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);
var sandwich = {toppings: [param1, param2]},
    madeCorrectly = (typeof(param1) === "string" && typeof(param2) === "string") ? true : false;
if (callback && typeof(callback) === "function") {  
    callback.apply(sandwich, [madeCorrectly]);  
  }  
}  

mySandwich('ham', 'cheese', function(correct) {
if(correct) {
    alert("Finished eating my " + this.toppings[0] + " and " + this.toppings[1] + " sandwich.");
} else {
    alert("Gross!  Why would I eat a " + this.toppings[0] + " and " + this.toppings[1] + " sandwich?");
  }
});



Related