程序的生命周期

Deno支持浏览器兼容的生命周期事件:loadunload 。开发者可以在程序中使用这些事件来提供初始化或清除代码。

load 事件的监听器可以是异步的,同时也会被等待(be awaited)。unload 事件的监听器必须是同步的。这两个事件都不能被取消。

举个栗子🌰:

  1. // main.ts
  2. import "./imported.ts";
  3. const handler = (e: Event): void => {
  4. console.log(`got ${e.type} event in event handler (main)`);
  5. };
  6. window.addEventListener("load", handler);
  7. window.addEventListener("unload", handler);
  8. window.onload = (e: Event): void => {
  9. console.log(`got ${e.type} event in onload function (main)`);
  10. };
  11. window.onunload = (e: Event): void => {
  12. console.log(`got ${e.type} event in onunload function (main)`);
  13. };
  14. console.log("log from main script");
  15. // imported.ts
  16. const handler = (e: Event): void => {
  17. console.log(`got ${e.type} event in event handler (imported)`);
  18. };
  19. window.addEventListener("load", handler);
  20. window.addEventListener("unload", handler);
  21. window.onload = (e: Event): void => {
  22. console.log(`got ${e.type} event in onload function (imported)`);
  23. };
  24. window.onunload = (e: Event): void => {
  25. console.log(`got ${e.type} event in onunload function (imported)`);
  26. };
  27. console.log("log from imported script");

注意,可以同时使用 window.addEventListenerwindow.onload / window.onunload 来定义事件的回调函数。 这两者有一个很重要的区别,再来举个栗子🌰:

  1. $ deno run main.ts
  2. log from imported script
  3. log from main script
  4. got load event in onload function (main)
  5. got load event in event handler (imported)
  6. got load event in event handler (main)
  7. got unload event in onunload function (main)
  8. got unload event in event handler (imported)
  9. got unload event in event handler (main)

所有通过 window.addEventListener 添加的事件都执行了,但是 imported.ts 中定义的window.onloadwindow.onunload 都被 main.ts 中的定义覆盖了。