Question

我在chrome和firefox中使用jQuery和flot。当我处理我的代码时，我发现执行在诸如访问不存在的哈希结构之类的愚蠢内容上无声地失败。

感觉jQuery中有一些try {} catch {}逻辑让我看不到任何错误。

关于如何解决这个问题的任何指针，如果没有全面的hack-n-slash来隔离一个简单的bug？

jshint并没有太大帮助。

- 编辑 -

更多调试显示趋势。

我基本上发现了拼写错误（未定义的变量）以及在对象属性存在之前过早取出它们。使用.hasOwnProperty（）有所帮助，但很麻烦。我想我在某个地方看到了一个方便的实用程序来帮助简洁地测试深层结构。

Answer 1

调试jQuery时，

.length是你的朋友。因为即使：

document.getElementById('nonexistent');

将在JavaScript中返回null，使用jQuery选择器将返回一个对象并转换true：

if(!document.getElementById('nonexistent')) {
    alert('not here!');
}

if(!$('#nonexistent')) {
    alert('here, here!');
}

这意味着：

$('#nonexistent').doSomething().doSomethingElse().whatever();

可能不会抛出错误，因此您很难知道链条中哪些“无法正常工作”。

但是，检查对象长度有效：

if(!$('#nonexistent').length) {
    alert('not here!');
}

jQuery被设计为无声地失败，因为它的一个核心用例是链接。如果选择器或原型方法在链中返回null或false，那么使用jQuery会比大多数没有经验的程序员想要的更频繁地抛出空引用错误。

<强>更新

如果处于调试模式，您可以通过修改原型来进行自己的调试。我试过这个：

var debug = ['hide','show'], // Array of jQuery methods to debug
    i = 0, name;

for(; debug[i]; i++) {
    name = debug[i];
    if (typeof $.fn[name] == 'function') {
        $.fn[name] = (function(name, fn) {
            return function() {
                if ( !this.length ) {
                    console.warn('No elements selected when calling '+name);
                }
                fn.apply(this, Array.prototype.slice.call( arguments ));
            };
        }(name, $.fn[name]));
    }
}

现在，每当我打电话给'hide'时，如果链中没有元素，它会警告我：

$('#nonexistent').hide();  // consoles a warning

小提琴：http://jsfiddle.net/B4XQx/

Answer 2

这里有解决方法：

jQuery error on null selector

但我怀疑这真的是你想要的 -

jquery隐藏了简单的javascript错误

2 个答案: