Question

有人可以告诉我，它是如何运作的例如

function animate(t) {   
    sun.rotation.y = t/1000;
    renderer.clear();
    camera.lookAt(sun.position);
    renderer.render(scene, camera);        
    window.requestAnimationFrame(animate, renderer.domElement);
};
animate(new Date().getTime());

如你所见，animate（）函数的参数为“t”。我们用它来调用这个函数。但是在animate（）func requestAnimationFrame内部调用它而没有“t”并且程序工作正常...我很困惑

Answer 1

一般情况

Javascript不要求您传递函数中的所有参数。如果你没有传递参数，那么变量将默认为undefined。

您还可以传递多于函数指定的参数，然后使用arguments对象访问它们，arguments对象包含传递给函数的所有参数的类数组对象。所以在你的例子中，t实际上是参数[0]的简写。所以你可以得到类似的东西。

function sumTwoNumbers(){
 return arguments[0] + arguments[1]
}

sumTwoNumbers(2,3) //returns 5

或者像这样

function getTwo(a,b,c,d) {
   return 2;
}

getTwo(); //returns 2 with no errors

您的案例

但是在animate（）函数内，requestAnimationFrame在没有“t”
的情况下调用它

还应该注意的是，没有参数就不会调用该函数。 'animate'作为参数传递给另一个函数（可能会在某个时候调用函数本身）。当一个函数在没有()之后被引用时，它将作为一个对象传递，而不是被执行。函数也是JS中的对象，因此可以像任何其他对象一样传递给函数。以下内容完全有效

function a(x){
  return x+2;
}

function b(y,z){
   return y(z);
}

b(a,2); //returns 4

Answer 2

在javascript中，您可以使用参数调用函数，不需要参数或更多您定义的参数。启动参数存储在名为arguments的类数组对象中。所有未公开的参数都将是未定义的

这是一个示例函数：

function sum(a,b) {
    console.log(arguments);
    a = a || 0;
    b = b || 0;
    return a + b;
}

使用不同的参数在控制台中尝试此功能。

console.log就像这样：

function sum(a,b) {
    console.log(arguments);
    a = a || 0;
    b = b || 0;
    return a + b;
}

>sum(2,4);
[2, 4]
6
>sum(2);
[2]
2
>sum(2,3,4,5);
[2, 3, 4, 5]
5

Answer 3

实际上，它并非“完美运作”。从第一帧到第二帧都有跳跃。

第一次调用animate()时，t的值是一个大整数，例如：

t = 1368990399980

当然，这是因为当您致电animate()时，您传递了Date().getTime()的返回值。

第二次及以后的animate()被调用，它被称为来自requestAnimationFrame()的回调，而t的值则完全不同：

t = 414.41499999928055
t = 431.52399999962654
t = 447.76099999944563

这是因为requestAnimationFrame()调用animate()并传入它自己的参数作为第一个参数。

self.requestAnimationFrame = function ( callback ) {

    var currTime = Date.now();
    var timeToCall = Math.max( 0, 16 - ( currTime - lastTime ) );
    var id = self.setTimeout( function() { callback( currTime + timeToCall ); }, timeToCall );
    lastTime = currTime + timeToCall;
    return id;

};

BTW，请注意上面列出的t的值以大约16的步长增加。这就是您的对象动画的原因。

带有参数调用的javascript函数，不带参数

3 个答案:

一般情况

您的案例