Question

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

我对如何调用return函数以及从哪里获取其输入参数感到困惑。这是一个取自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）。

例如：

＆＃13;

//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);

＆＃13;

Answer 2

返回的函数就是一个函数。因此，调用quad的参数是在调用它时定义的。外部函数仅用作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 3

函数碰撞返回一个匿名函数。不会立即调用此匿名函数。只有在返回的函数保存为变量时才会调用它，然后调用该变量。

示例：

//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 4

表达式collide(nodes[i])的值是从collide返回的函数。它没有被调用，但函数被传递到visit方法。

稍后visit将调用collide中创建的函数，即为函数提供参数的时间。类似的东西：

visit: function(collideFunc){

  // ...

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

  // ...

}

Answer 5

你只需使用这个：

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

Answer 6

了解javascript闭包有助于我深入了解函数返回函数的过程。对于那些仍然感到困惑的人，请查看这两个链接，这些链接很好地解释了这个概念：

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

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

Javascript函数返回带参数的函数

6 个答案: