参数如何传递给匿名回调函数？

Question

我正在学习AngularJS，并已从教程中复制了该基本代码的代码（简化/伪代码仅包含与此问题相关的部分）。
该代码对我有用，但是我试图更好地了解如何在success方法中将参数传递给回调。

// jobService object
var jobService = {         
        get : function() {
         return $http.get( 'some/api/url' );
        }
    };

jobService.get().success(function (data) {
        $scope.jobs = data;
    });

我的问题是，知道“正常”参数是在调用时专门传递给函数的，即：

function foo(arg1) {
     alert(arg1); //alerts Hello!
};

foo('hello!');

data参数如何传递到匿名回调函数中？ 是吗：

• 被AngularJS“注入”了吗？
• JavaScript引擎是否只是在称为data的本地范围内使用变量？
• 如果success方法，javascript引擎会在父对象上查找data属性吗？

Answer 1

TL; DR

我们只是在定义该匿名函数，而不是调用它！

因此， data是函数参数，而不是函数参数。

---

长版

让我们把它分成小块。

success()是一个函数。 在jobService.get()之后被称为链。 因此，无论jobService.get()调用返回什么，我们都在调用该对象的成功函数（例如jobService.get() returnedObject.success() ）。

回到success()本身。 它可以轻松读取其对象的其他属性（上例中的returnObject ）。 由于我们将匿名回调函数作为参数传递，因此success可以轻松地执行以下操作（将其范围缩小至基本JS）：

function success(callback) {
    var whatever = "I'm passing this to the callback function";
    callback(whatever);
}

这实际上会调用我们的匿名函数中，我们通过了，并指定whatever的data （ 不要忘记，我们只是定义一个匿名函数，不是要求它！）。 这使data成为函数参数，并且基本上是一个自定义名称，用于表示和访问success函数传递给其回调函数的内容。 您可以在那里使用任何内容-仍然可以正常工作：

jobService.get().success(function (somethingElse) {
    $scope.jobs = somethingElse;
});

希望我不要太复杂。 我试图从简单的JS角度逐步解释它，因为您可以轻松阅读Angular的源代码以了解它的作用，因此我认为您需要这个简单的解释。

---

这是一个复制那里发生的事情的基本示例（检查JS源，查看在所有三种情况下输出如何相同）：

 var debug = document.getElementById('debug'); function success(callback) { var whatever = 'hello world'; debug.innerHTML += '<br>success function called, setting parameter to <span>' + whatever + '</span><br>'; callback(whatever); } function callbackFunction(someParameter) { debug.innerHTML += '<br>callbackFunction called with parameter <span>' + someParameter + '</span><br>'; } success(callbackFunction); // anon function success(function(val) { debug.innerHTML += '<br>anonymous callback function called with parameter <span>' + val + '</span><br>'; }) // anon function 2 success(function(anotherVal) { debug.innerHTML += '<br>second anonymous callback function called with parameter <span>' + anotherVal + '</span><br>'; }) 

 span { color: green; } 

 <div id="debug"></div> 

使用对象的示例，与原始代码中的操作类似：

 var debug = document.getElementById('debug'); var myObject = { whatever: 'hello world', success: function(callback) { debug.innerHTML += '<br>success function called, fetching object property and setting the parameter to <span>' + this.whatever + '</span><br>'; callback(this.whatever); }, modifyMe: function() { debug.innerHTML += '<br>object property modified<br>'; this.whatever = 'another world'; return this; // this is crucial for chaining } } // anon function callback myObject.success(function(val) { debug.innerHTML += '<br>anonymous callback function called with parameter <span>' + val + '</span><br>'; }) debug.innerHTML += '<br><hr>'; // chaining - calling a success function on a modified object myObject.modifyMe().success(function(val) { debug.innerHTML += '<br>anonymous callback function called with modified parameter <span>' + val + '</span><br>'; }) 

 span { color: green; } 

 <div id="debug"></div> 

Answer 2

这是源代码中的相关部分：

 promise.success = function(fn) {
        promise.then(function(response) {
          fn(response.data, response.status, response.headers, config);
        });

        return promise;
 };

阅读更多关于GITHUB 。