0

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

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”并且程序运行完美..我很困惑

4

3 回答 3

4

一般情况

Javascript 不要求您在函数中传递所有参数。如果您不传递参数，则该变量将默认为未定义。

您还可以传递比函数指定更多的参数，然后使用 arguments 对象访问它们，arguments 对象是一个类似数组的对象，包含传递给函数的所有参数。因此，在您的示例中，t 实际上是 arguments[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() func requestAnimationFrame 内部调用它时没有“t”

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

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

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

b(a,2); //returns 4
于 2013-05-19T18:23:17.850 回答
1

在 javascript 中，您可以调用带有参数、不带参数或您定义的更多参数的函数。启动参数存储在称为参数的类数组对象中。并且所有未通过的参数都将是未定义的

这是一个示例函数：

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
于 2013-05-19T18:30:14.613 回答
1

实际上，它并不是“完美运行”。从第一帧到第二帧有一个跳跃。

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

t = 1368990399980

当然，这是因为当您调用 时animate()，您传入了 from 的返回值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;

};

顺便说一句，请注意t上面列出的值以大约 16 的步长递增。这就是您的对象设置动画的原因。

于 2013-05-19T19:25:21.237 回答