无休止的控制台日志,javascript不会离开函数requestAnimationFrame
我在控制台中得到无休止的“渲染”。。。为什么会发生这种情况?我想不出来(我一整天都在做这件事。你们能看看问题出在哪里吗 控制台:无休止的控制台日志,javascript不会离开函数requestAnimationFrame,javascript,canvas,recursion,requestanimationframe,Javascript,Canvas,Recursion,Requestanimationframe,我在控制台中得到无休止的“渲染”。。。为什么会发生这种情况?我想不出来(我一整天都在做这件事。你们能看看问题出在哪里吗 控制台: turnEvent render 10 times render Infunction: 150.458ms 6534 and counting times render var turnEvent = function turnEvent(AnX, AnY) { var first = true; console.time('Infunction'
turnEvent
render
10 times render
Infunction: 150.458ms
6534 and counting times render
var turnEvent = function turnEvent(AnX, AnY) {
var first = true;
console.time('Infunction');
var lengd = rects.length, i;
one30 = 10,
one40 = 10,
one301 = false,
one401 = false;
for (i = 0; i < lengd; i += 1) {
if (collides([rects[i]], AnX, AnY)) {
var rightBox = rects[i];
var rectangle = rects2[i];
}
}
console.log("turnEvent");
rounded_rect(rectangle.x, rectangle.y, 90, 110, 10, 'black', 'black');
function render() {
console.log("render"); <----------- ENDLESS CONSOLE LOGS
-----some canvas drawings here------
.......
----if and else conditions----
if (one301 && one401) {
rounded_rect(rectangle.x, rectangle.y, 90, 110, 10, null, 'black');
console.timeEnd('Infunction');
}
}
(function animloop(){
requestAnimationFrame(animloop);
render();
})();
}
代码:
turnEvent
render
10 times render
Infunction: 150.458ms
6534 and counting times render
var turnEvent = function turnEvent(AnX, AnY) {
var first = true;
console.time('Infunction');
var lengd = rects.length, i;
one30 = 10,
one40 = 10,
one301 = false,
one401 = false;
for (i = 0; i < lengd; i += 1) {
if (collides([rects[i]], AnX, AnY)) {
var rightBox = rects[i];
var rectangle = rects2[i];
}
}
console.log("turnEvent");
rounded_rect(rectangle.x, rectangle.y, 90, 110, 10, 'black', 'black');
function render() {
console.log("render"); <----------- ENDLESS CONSOLE LOGS
-----some canvas drawings here------
.......
----if and else conditions----
if (one301 && one401) {
rounded_rect(rectangle.x, rectangle.y, 90, 110, 10, null, 'black');
console.timeEnd('Infunction');
}
}
(function animloop(){
requestAnimationFrame(animloop);
render();
})();
}
var-turnEvent=函数turnEvent(AnX,任意){
var first=真;
控制台时间('Infunction');
var lengd=矩形长度,i;
一个30=10,
一个40=10,
one301=false,
one401=假;
对于(i=0;i log(“render”);因为requestAnimationFrame将调用animloop,后者将执行另一个执行animloop等的requestAnimationFrame调用,这是一个递归操作
您需要在animloop中设置一个条件,以不调用requestAnimationFrame
(function animloop(){
if(someConditionMet){
//return without executing another requestAnimationFrame
return;
}
requestAnimationFrame(animloop);
render();
})();