在 Chrome 控制台中检查 JS 变量的值答案

【问题标题】：Inspecting the value of a JS variable in Chrome console在 Chrome 控制台中检查 JS 变量的值
【发布时间】：2015-06-03 14:56:58
【问题描述】：

这是我在我的网站上使用的一个 JS 插件的片段。我想直接在控制台中检查isTouchDevice 的值。只需键入 isTouchDevice 就会返回“未定义”错误。

(function($) {

    "use strict";

    $.maxmegamenu = function(menu, options) {

        var plugin = this;

        var $menu = $(menu);

        plugin.settings = {};

        var isTouchDevice = function() {
            return ('ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0);
        };
})(jQuery);

如何在 Chrome 控制台中检查 isTouchDevice 变量的值？

编辑 1：

澄清一下，首先，我需要能够直接在控制台中检查var isTouchDevice 的值，而无需添加任何代码。其次，console.log(isTouchDevice) 可能会返回一个“未定义错误”，这可能是由于变量封装（它在全局范围内不可用）所以只是控制台记录它不是一种方法。

【问题讨论】：

为简单起见，您可以在 chrome 控制台中运行 ('ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0)。否则，您可以在声明后放置一个断点并在您的开发工具中添加一个监视
请注意，您的代码 sn-p 中的 isTouchDevice 分配了一个函数。通过调用它来获取访问它所需的值 console.log(isTouchDevice());您还需要在声明的块 var isTouchDevice 内的正确范围内调用它
@RGraham，这是一个很好的建议，可以解决我的问题 - 直接在控制台中执行表达式..
@lid 只是出于好奇，因为我的问题已经解决了。由于范围限制，我将无法直接在控制台中检查isTouchDevice()？
@luqo33，没错，要访问您需要在正确范围链中的方法。请参阅：gist.github.com/anonymous/db528b893d477b49775a 假设如果您需要在控制台中的特定范围/conext 内运行任意代码，提到的方法 eck 就是解决方法。

标签： javascript jquery google-chrome google-chrome-devtools

【解决方案1】：

您还可以在 maxmegamenu 函数的末尾添加 debugger; 语句。

当 chrome 在该语句上中断时，控制台将在该函数的上下文中，然后应定义 isTouchDevice。

【讨论】：

【解决方案2】：

使用console.log(isTouchDevice);

或其他console 方法，例如 .info.warn.error.debug

或者您可以使用console.group('this is some event'); 进行分组，然后使用console.groupEnd(); 关闭组

最后一个方法是console.groupCollapsed('some title of group');，会创建组，但会在控制台中折叠，占用空间更少

【讨论】：