4

有时，当您检查 jQuery 对象时，您会看到x.fn.x.init. 或者，在这个页面上它被缩小为e.fn.e.init, where x === e === jQuery，虽然我不确定第二个eorx是什么。

考虑一下：在此页面上的控制台中：

$
>> function (a,b){return new e.fn.init(a,b,h)}

[$()]
>> [e.fn.e.init[0]]

0 是类数组 jQuery 对象的长度。但是，怎么e.fn.init去e.fn.e.init？第二个e是什么？

更新

我刚刚在我的页面上包含了一个未缩小的版本，它显示为jQuery.fn.jQuery.init. 真的很困惑为什么jQuery在那里两次。

我刚刚在控制台中尝试过jQuery === jQuery.fn.jQuery，它返回 false。其实jQuery.fn.jQuery是未定义的。奇怪的...

4

1 回答 1

1

我在谷歌的控制台 api 参考中没有找到任何明确的解释，但我很好奇理解，这是我的结论。

这是 jQuery 中发生的事情的简化版本，只保留问题上下文中有趣的内容。

var jQuery = function() {
    return new jQuery.fn.init();
};

jQuery.fn = jQuery.prototype = {
    init: function() {
        return this;
    }
};
var j = jQuery();
console.log(j);
>> jQuery.fn.jQuery.init {}

在控制台中记录对象时，Chrome 会显示某种内部标识符，这取决于对象在代码中的设置方式。它是对象结构在创建对象的命名空间中的某种表示。如果您要反转 fn 和原型（即jQuery.prototype = jQuery.fn = {...），它将打印为jQuery.fn.init而不是jQuery.fn.jQuery.init.

奇怪的是，如果你要添加类似数组的属性（就像 jQuery 一样），它会在控制台中以不同的方式显示对象。我已经尝试删除/添加属性，似乎添加一个length具有数字类型值的splice属性和一个具有函数类型值的属性，你会得到像数组一样显示在控制台中的对象（带方括号）。

var jQuery = function() {
    return new jQuery.fn.init();
};

jQuery.fn = jQuery.prototype = {
    init: function() {
        return this;
    },
    length: 0,
    splice: function(){}
};
jQuery.fn.init.prototype = jQuery.fn;

var j = jQuery();
console.log(j);
>> [init: function, splice: function]

所以，我认为我们不应该过多关注 Chrome 打印出对象“名称”的方式或它如何格式化它......

于 2013-11-20T16:01:30.040 回答