简化，我正在做的是在控制台中运行它：
window.onbeforeunload = function (e) {
console.log(e);
}
但是在控制台中，当事件触发时（通过在编写 SO 问题的过程中尝试“离开页面”）我看到的是：
Event {clipboardData: undefined, cancelBubble: false, returnValue: true, srcElement: document, defaultPrevented: false…}
旁边有一个小“i”图形。当我单击它旁边的箭头以在控制台中展开对象时，没有任何反应。箭头转动表示它已经展开，但它没有展开。
我在这里错过了什么？？
【问题讨论】：
标签： javascript google-chrome google-chrome-devtools
发生这种情况是因为尽管您让控制台在页面更改时持续存在，但 Object 不再存在 - 当您离开页面时它已被销毁。这意味着它根本无法再被检查，因此单击向下的三角形没有帮助。
试试这个，以防止页面实际发生变化：
window.onbeforeunload = function (e) {
console.log(e);
return true;
}
现在页面会提示询问您该做什么。在出现的提示中单击“取消”以保留在页面上。现在您可以根据需要在控制台中检查Event。
不同之处在于onbeforeunload 函数现在返回的值不是null/undefined。返回值可以是任何值，甚至是'' 或false 等...除了null 和undefined 之外的任何值，它仍然会导致页面在导航之前提示，从而让您有机会检查事件。请记住，如果没有 return 语句，JavaScript 函数默认返回 undefined。
当您无法在 Chrome 开发工具中检查某些内容时，90% 的时间是因为某些操作导致该内容变得不可用...页面从该对象存在时开始移动。
【讨论】：
老问题。但是这个简单的解决方案对我来说效果更好。使用
function(e) {
console.dir(e);
}
【讨论】：
我刚刚遇到了一个问题，我的 API PUT 请求在我的 chrome 开发工具的控制台选项卡中显示为 cancelled，我看到了相同的行为，我无法扩展对象和小i 图标显示在控制台条目旁边。我决定发布这个答案并附上我的问题的链接，以防它可能对其他人有所帮助。
Api PUT request showing as "cancelled" with error message "TypeError: failed to fetch"
【讨论】：
在检查对象或数组时，这是一个很好的做法，这些对象或数组稍后会更改以放入一个
debugger
...在要调试的代码点之后。这会在此时暂停代码的执行，这意味着您可以确定您看到的是它的状态此时，而不是看到任何后续更改。
扩展失败可能意味着该对象随后从内存中删除：可能已删除或被垃圾收集，或者（特别是如果您在 Node.js 脚本上使用 Chrome 开发工具）可能是脚本已完成，所以 所有 refs 现在没有指向任何地方。
事实上，可以说更好的做法是使用debugger 而不是console.log，然后在局部变量中找到您想要检查的内容。
window.onbeforeunload = function (e) {
debugger; // Now go find `e` in the local variables section
}
这样，您可以访问更多上下文，而不必担心代码后面发生的事情会导致输出更改。
永远记住，在 JavaScript 中，任何时候处理指向对象的变量时，都是在处理实时的引用，处于最新状态那个对象。
console.log 记录引用，而不是对象的内容，当您查看和展开记录的引用时，您正在查看该引用在您查看时所指向的内容它，而不是您记录它的时间。如果它已从内存中删除或重新分配，这可能什么都不是。
指向字符串和数字的变量指向值而不是引用，因此另一种选择可能是记录对象的字符串化版本，例如console.log(JSON.stringify(someObject))（尽管该输出可能更难阅读）。 debugger 方法通常更好。
【讨论】：