函数表达式参数未赋值，但有值

Question

我希望有人能解释下面的函数表达式是如何工作的。参数 'p' 没有被赋值，但是它在函数体中用于计算（定义 "angle" 和 "tail" 变量）并且在 draw( ）叫做。当您单步执行代码时，您可以看到参数 'p' 确实有一个值（参见附图）- 但我不明白该值从何而来。请注意，在查看完整代码时，'p' 未在其他任何地方注明。

当您将 'p' 登录到控制台时，您会看到以下值，这些值会随着应用程序的运行而不断增加： Image of console.log(p);

这里是完整的函数表达式和函数调用：

var draw = function(p) { 
  $.fillStyle = "hsla(38,5%,12%,.90)";
  $.fillRect(0, 0, w, h); 
  $.fillStyle = "hsla(38, 25%, 90%, 1)"; 
  $.strokeStyle = "hsla(38, 25%, 90%, 1)";
  for (var i = 0; i < numh; i++)
    for (var j = 0; j < numw; j++) {
      var diagnalW = j * spacing +
        (i % 2 ? 0 : spacing / 2);
      var diagnalH = i * spacing;
      var arr = [position[0] - diagnalW,
          position[1] - diagnalH
        ],
        wave = Math.sqrt(arr[0] * arr[0] +
          arr[1] * arr[1]),
        arr = [arr[0] / wave, arr[1] / wave],
        angle = 50 * (Math.cos(p / 360 - wave / 105) - 1);
      $.beginPath();
      $.arc(diagnalW + arr[0] * angle, diagnalH +
        arr[1] * angle, 2.8, 0, 2 * Math.PI, false);
      $.closePath();
      $.fill();
      for (var n = 0; n < 5; n++) {
        var tail = 50 * (Math.cos((p - 50 * n) /
          360 - wave / 105) - 1);
        $.beginPath();
        $.moveTo(diagnalW + arr[0] * angle, diagnalH +
          arr[1] * angle);
        $.lineWidth = 5 - n;
        $.lineTo(diagnalW + arr[0] * tail, diagnalH + arr[1] * tail);
        $.stroke()
      }
    }
};

var anim = function(p) {
  window.requestAnimationFrame(anim);
  draw(p);
};
anim();

除了'p'如何获取控制台中显示的值外，我了解此代码的所有内容。另外 - 如果不清楚，这是一个 html5 canvas 应用程序。

（旁注：不，上面的 $ 不是 jQuery。这只是原作者用于她的 canvas 上下文对象。）

Answer 1

在对 draw 的 第一次 调用中，p 将具有值 undefined 因为 anim() 没有通过p 的值，然后 anim 在调用 draw.

时使用 p

之后，draw 被浏览器调用，而不是被该代码调用，因为它被用作 requestAnimationFrame 的回调。浏览器将使用高分辨率计时器值调用它，这就是您在 p.

中看到的内容

Answer 2

p 是 window.requestAnimationFrame

的回调参数

A parameter specifying a function to call when it's time to update your animation for the next repaint. The callback has one single argument, a DOMHighResTimeStamp, which indicates the current time (the time returned from performance.now()) for when requestAnimationFrame starts to fire callbacks.

函数表达式参数未赋值，但有值

Function Expression Parameter is not assigned a value, but has a value

javascript

canvas

parameters

function-expression