使用参数返回函数的Javascript函数

Question

有关函数返回另一个函数的几个帖子，如this post。但是，当返回的函数包含参数时会发生什么？

我很困惑，如何调用返回函数，以及从哪里获取输入参数。这是从d3 collision feature.

例如采取一个例子，

force.on("tick", function(e) { 
    var q = d3.geom.quadtree(nodes), //q is a quadtree factory 
     i = 0, //counter variable 
     n = nodes.length; //number of nodes 

    while (++i < n) 
    q.visit(collide(nodes[i])); ///////// collide function called here ///////// 

); }); 


function collide(node) { 
    var r = node.radius + 25, 
     nx1 = node.x - r, 
     nx2 = node.x + r, 
     ny1 = node.y - r, 
     ny2 = node.y + r; 

/////// How does the below function work? 
/////// Arguments quad, x1, y1, x2, y2 are not passed, 
////// but the code works 

    return function(quad, x1, y1, x2, y2) { 

    if (quad.point && (quad.point !== node)) { 
      //do something 

     } 
     return x1 > nx2 || x2 < nx1 || y1 > ny2 || y2 < ny1; 
     }; 
} 

Answer 1

通过调用collide(nodes[i])返回的功能是为visit功能的回调函数。回调函数在visit函数内执行。 visit函数提供了适当的参数。

但是我们在这里不能自由选择参数。应使用的参数已由visit函数的作者预定义（visit函数的参数记录为here）。

如：

//arguments of calc function are a function and two numbers 
 
    function calc(callback,x,y){ 
 
     callback(x,y); //the callback function is called with 2 parameters here. 
 
         //So the 1st argument to the calc function (callback) should also accept two arguments 
 
    } 
 
    
 
    calc(function(a,b){ //calling calc function with arg1 = "function to calculate sum", arg2 = 1, arg3 = 2 
 
     document.write(a+b); 
 
    },1,2);

Answer 2

你只需要使用这个像这样：

collide(node)(quad, x1, y1, x2, y2); 

Answer 3

返回的功能很简单，就是一个函数。所以四元组的参数在被调用时被定义。外功能只是作为一个“包装”为nx值和ny

一个更简单的，极人为的例子：

function wrapName (personName) { 
    return function greet (greeting) { 
    return greeting + ' ' + personName; 
    }; 
} 

// greetBobWith is now the returned function, which accepts a `greeting` param 
// but still has a reference to `personName` 
var greetBobWith = wrapName('bob'); 

greetBobWith('Hello!'); // "Hello! Bob" 
greetBobWith('Happy Holidays'); // "Happy holidays, Bob" 

Answer 4

函数碰撞返回匿名函数。这个匿名函数不会立即调用。只有当返回的函数被保存为一个变量并且该变量被调用时才会被调用。

实施例：

//declare quad, x1, y1, x2, y2 here or in a parent scope 
var returnedFunction = collide(someNode); 
var returnedBool = returnedFunction(quad, x1, y1, x2, y2); 

function collide(node) { 
    var r = node.radius + 25, 
    nx1 = node.x - r, 
    nx2 = node.x + r, 
    ny1 = node.y - r, 
    ny2 = node.y + r; 

    /////// How does the below function work? 
    /////// Arguments quad, x1, y1, x2, y2 are not passed, 
    ////// but the code works 

     return function(quad, x1, y1, x2, y2) { 

     if (quad.point && (quad.point !== node)) { 
      //do something 

     } 
     return x1 > nx2 || x2 < nx1 || y1 > ny2 || y2 < ny1; 
     }; 
    } 

Answer 5

表达collide(nodes[i])的值是从collide返回的功能。它没有在那里被调用，但是该函数被传递给visit方法。

稍后visit将调用在collide中创建的函数，也就是当参数提供给函数时。类似于：

visit: function(collideFunc){ 

    // ... 

    var collided = collideFunc(quad, x1, y1, x2, y2); 

    // ... 

} 

Answer 6

了解JavaScript闭包帮助我深入了解函数返回函数的过程。对于那些谁仍是一头雾水，看看这两个环节这就解释了这一概念非常好：

http://www.w3schools.com/js/js_function_closures.asp

http://bost.ocks.org/mike/chart/