RequestAnimation方法使用

Question

为什么动画方法一定要这么写
let x = 1;

  function animation() {
    x += -0.01;
    gl.vertexAttrib1f(deg, x);
    gl.drawArrays(gl.TRIANGLES, 0, 3);
    requestAnimationFrame(animation);
  }
  animation();

才能生效，而不能这么写
let x = 1;

  function animation() {
    x += -0.01;
    gl.vertexAttrib1f(deg, x);
    gl.drawArrays(gl.TRIANGLES, 0, 3);
  }
  requestAnimationFrame(animation);

第一种写法为什么不会死循环

Answer 1

yancy 2023-03-10 12:58:28

           

• 提问者 精慕门1158658 #1

  谢谢老师，明白了

Answer 2

yancy 2023-03-10 11:12:14

第二种是正常的函数执行，只会执行一次，这个方法和计时器的不同是不会重复的执行回调函数。所以需要通过递归调用的方式来重复执行。

• 提问者 精慕门1158658 #1

  这个点明白了， 还有一个问题，
  这样写为什么会内存溢出
   let x = 1;
  
        function animation(x) {
          x += -0.01;
          gl.vertexAttrib1f(deg, x);
          gl.drawArrays(gl.TRIANGLES, 0, 3);
          requestAnimationFrame(animation(x));
        }
  
        animation(x);
  
  报错：Uncaught RangeError: Maximum call stack size exceeded