[javascript] JavaScript : 콜백 함수에 매개 변수 전달

콜백으로 사용되는 함수에 일부 매개 변수를 전달하려고하는데 어떻게해야합니까?

function tryMe (param1, param2) {
    alert (param1 + " and " + param2);
}

function callbackTester (callback, param1, param2) {
    callback (param1, param2);
}

callbackTester (tryMe, "hello", "goodbye");

답변

좀 더 일반적인 것을 원한다면 arguments 변수를 다음과 같이 사용할 수 있습니다.

function tryMe (param1, param2) {
    alert(param1 + " and " + param2);
}

function callbackTester (callback) {
    callback (arguments[1], arguments[2]);
}

callbackTester (tryMe, "hello", "goodbye");

그러나 그렇지 않으면 예제가 잘 작동합니다 (테스터에서 콜백 대신 인수 [0]을 사용할 수 있음)

답변

이것은 또한 작동합니다 :

// callback function
function tryMe (param1, param2) {
    alert (param1 + " and " + param2);
}

// callback executer 
function callbackTester (callback) {
    callback();
}

// test function
callbackTester (function() {
    tryMe("hello", "goodbye");
});

다른 시나리오 :

// callback function
function tryMe (param1, param2, param3) {
    alert (param1 + " and " + param2 + " " + param3);
}

// callback executer 
function callbackTester (callback) {
//this is the more obivous scenario as we use callback function
//only when we have some missing value
//get this data from ajax or compute
var extraParam = "this data was missing" ;

//call the callback when we have the data
    callback(extraParam);
}

// test function
callbackTester (function(k) {
    tryMe("hello", "goodbye", k);
});

답변

질문이 불분명합니다. 더 간단한 방법으로이 작업을 수행하는 방법을 묻는다면 Function.prototype 의 멤버 인 ECMAScript 5th edition 메소드 .bind ()를 살펴보십시오 . 그것을 사용하면 다음과 같이 할 수 있습니다 :

function tryMe (param1, param2) {
    alert (param1 + " and " + param2);
}

function callbackTester (callback) {
    callback();
}

callbackTester(tryMe.bind(null, "hello", "goodbye"));

다음 코드를 사용할 수도 있습니다.이 코드는 현재 브라우저에서 사용할 수없는 경우 메소드를 추가합니다.

// From Prototype.js
if (!Function.prototype.bind) { // check if native implementation available
  Function.prototype.bind = function(){
    var fn = this, args = Array.prototype.slice.call(arguments),
        object = args.shift();
    return function(){
      return fn.apply(object,
        args.concat(Array.prototype.slice.call(arguments)));
    };
  };
}

예

bind () -프로토 타입 JS 문서

답변

특정 수의 매개 변수가있는 코드 이외의 다른 콜백이 있고 추가 매개 변수를 전달하려는 경우 콜백과 래퍼 내부가 추가 매개 변수를 전달할 때 래퍼 함수를 전달할 수 있습니다.

function login(accessedViaPopup) {
    //pass FB.login a call back function wrapper that will accept the
    //response param and then call my "real" callback with the additional param
    FB.login(function(response){
        fb_login_callback(response,accessedViaPopup);
    });
}

//handles respone from fb login call
function fb_login_callback(response, accessedViaPopup) {
    //do stuff
}

답변

콜백 함수에 몇 개의 매개 변수가 전달 될지 확실하지 않으면 function을 사용하십시오 apply.

function tryMe (param1, param2) {
  alert (param1 + " and " + param2);
}

function callbackTester(callback,params){
    callback.apply(this,params);
}

callbackTester(tryMe,['hello','goodbye']);

답변

‘부모’함수가 호출 될 때 평가되지 않도록 함수 래퍼 내에 인수로 / 인수로 전달되는 ‘자식’함수를 래핑하십시오.

function outcome(){
    return false;
}

function process(callbackSuccess, callbackFailure){
    if ( outcome() )
        callbackSuccess();
    else
        callbackFailure();
}

process(function(){alert("OKAY");},function(){alert("OOPS");})

답변

여러 매개 변수와 콜백 컨텍스트가 포함 된 질문의 코드 :

function SomeFunction(name) {
    this.name = name;
}
function tryMe(param1, param2) {
    console.log(this.name + ":  " + param1 + " and " + param2);
}
function tryMeMore(param1, param2, param3) {
    console.log(this.name + ": " + param1 + " and " + param2 + " and even " + param3);
}
function callbackTester(callback, callbackContext) {
    callback.apply(callbackContext, Array.prototype.splice.call(arguments, 2));
}
callbackTester(tryMe, new SomeFunction("context1"), "hello", "goodbye");
callbackTester(tryMeMore, new SomeFunction("context2"), "hello", "goodbye", "hasta la vista");

// context1: hello and goodbye
// context2: hello and goodbye and even hasta la vista