為什么在e.fn.e.init或x.fn.x.init中有第二個e或x（jQuery實例名稱，在chrome調試器中）？

Question

有時當你檢查jQuery對象時，你會看到x.fn.x.init 。 或者，在這個頁面上它縮小為e.fn.e.init ，其中x === e === jQuery ，雖然我不確定第二個e或x是什么。

考慮一下：在此頁面的控制台中：

$
>> 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是未定義的。 奇怪...

Answer 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和prototype（即jQuery.prototype = jQuery.fn = {... ），它將打印為jQuery.fn.init而不是jQuery.fn.jQuery.init 。

奇怪的是，如果你要添加類似數組的屬性（就像jQuery那樣），它會在控制台中以不同的方式顯示對象。 我嘗試刪除/添加屬性，似乎添加一個帶有Number類型值的length屬性和一個帶有Function類型值的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打印出對象的“名稱”或者如何格式化它的方式......