JavaScript 版本的 ActionScript 的 Event.ENTER_FRAME 事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6615064/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript's version of ActionScript's Event.ENTER_FRAME event?
提问by denniss
I am trying to learn JavaScript and I am wondering whether JavaScript has a event listener just like ActionScript's ENTER_FRAME. Basically, I want this event listener to listen "all the time" not just wait for any particular instance (mouse click, keyboard event) of event.
我正在尝试学习 JavaScript，我想知道 JavaScript 是否有一个事件侦听器，就像 ActionScript 的 ENTER_FRAME。基本上，我希望这个事件侦听器“一直”侦听，而不仅仅是等待事件的任何特定实例（鼠标单击、键盘事件）。
回答by just_a_dude
This would probably be worth a look too : http://paulirish.com/2011/requestanimationframe-for-smart-animating/
这可能也值得一看：http: //paulirish.com/2011/requestanimationframe-for-smart-animating/
回答by user6004401
HTML5 provides access to the requestAnimationFrame()
HTML5 提供访问 requestAnimationFrame()
<canvas id="canvas" width="400" height="400"></canvas>
<script>
window.onload = function () {
var canvas = document.getElementById('canvas'),
context = canvas.getContext('2d'),
var counter = 0;
(function drawFrame () {
window.requestAnimationFrame(drawFrame, canvas);
context.clearRect(0, 0, canvas.width, canvas.height);
console.log(counter++);
// animation code goes here
}());
};
</script>
Credit goes to Keith Peters for helping sort this out. Highly recommend his book 'HTML5 animation with Javascript' by FriendsOfEd: http://www.apress.com/9781430236658
感谢 Keith Peters 帮助解决了这个问题。强烈推荐 FriendsOfEd 所著的《HTML5 动画与 Javascript》一书：http: //www.apress.com/9781430236658
回答by cwallenpoole
You're looking for setInterval(func, time). In the case of making it work like ENTER_FRAME, then you would make time very small. So, if you wanted to imitate a frame rate of say, 30 times a second:
您正在寻找setInterval(func, time). 在让它像 ENTER_FRAME 一样工作的情况下，那么你会让时间变得非常少。因此，如果您想模仿每秒 30 次的帧速率：
// you will need to make sure you have good scoping around the function param.
setInterval(function(){console.log('enterframe')}, 33)
// 33 is about 1000 milliseconds / 30.
Actually, setIntervalis in Flash too -- flash.utils.setInterval.
其实，setInterval也是在Flash中—— flash.utils.setInterval。
As a side note -- unfortunately, setInterval(in both Flash and JS) can work against the native refresh rate. In Flash ENTER_FRAME avoids this -- you render when the swf re-renders. In the browser, well, setIntervalsimply can't do that.
作为旁注 - 不幸的是，setInterval（在 Flash 和 JS 中）可能会影响本机刷新率。在 Flash 中 ENTER_FRAME 避免了这种情况——您在 swf 重新渲染时进行渲染。在浏览器中，好吧，setInterval根本无法做到这一点。
回答by ALR
I am still learning how to convert AS3 to JavaScript, but would it not be this function:
我还在学习如何将 AS3 转换为 JavaScript，但不会是这个函数：
createjs.Ticker.addEventListener("tick", gameLoop);
gameLoopis the custom function that will be called on every 'tick'.
gameLoop是将在每个“滴答”上调用的自定义函数。
Check out this helpful example of writing a game in Adobe Animate CC using JavaScript instead of AS3: https://software.intel.com/en-us/html5/hub/blogs/flash-cc-to-html5
查看这个使用 JavaScript 而不是 AS3 在 Adobe Animate CC 中编写游戏的有用示例：https: //software.intel.com/en-us/html5/hub/blogs/flash-cc-to-html5
回答by sdleihssirhc
Nope. Not really. A good substitute would be setIntervalor setTimeout:
不。并不真地。一个好的替代品是setIntervalor setTimeout：
function doAllTheTime() { }
function wrapper() {
doAllTheTime();
setTimeout(wrapper, 40);
}
wrapper();
But even then, you're pretty limited, because you don't have access to any of the event object properties.
但即便如此，您仍然非常有限，因为您无权访问任何事件对象属性。
