javascript - 为什么 Chrome Dev Tools 检查器显示的值与代码中的值不同？

Question

一图胜千言。也许我累了我不知道，但这让我出于某种原因陷入困境并且毫无意义。谁能指出我正确的方向？

> 右击图片并在新标签页中打开

独立代码

/**
 * @file maestro.class.js
 *
 * @external $M         Main Maestro Object
 * @external $M.Core    Maestro Core Object
 */

/**
 * A modified version of class.js to cater to static inheritance and deep 
 * object cloning. Based almost completely on class.js (Javascript MVC -- 
 * Justin Meyer, Brian Moschel, Michael Mayer and others)
 * (http://javascriptmvc.com/contribute.html)
 *
 * - Some portions adapted from Prototype JavaScript framework, version 1.6.0.1 (c) 2005-2007 Sam Stephenson
 * - Some portions extracted from jQuery 1.7
 * - String utilities methods removed and added to String prototype. Documentation
 * added and making code Closure Compiler Advanced Safe by Andrew Donelson.
 *
 * Class system for javascript
 *
 * Setup method will be called prior to any init -- nice if you want to do things without needing the
 * users to call _super in the init, as well as for normalizing parameters.
 *
 * @class Class
 * @expose
 * @namespace Class
 * @memberof Core
 * Advanced Optimization Compliant
 */
(function (m$)
{
    var 
        /** 
         * I have dropped this code for production, But it's bothering as to why
         * this is happening and I would like to get it figured out.
         *
         * @property {Object} regs
         * @expose 
         */
        regs = {
            'undHash':/_|-/,
            'colons':/::/,
            'words':/([A-Z]+)([A-Z][a-z])/g,
            'lowUp':/([a-z\d])([A-Z])/g,
            'dash':/([a-z\d])([A-Z])/g,
            'replacer':/\{([^\}]+)\}/g,
            'dot':/\./
        },

        /**
         * @method getNext
         * @expose
         * @param {*} current
         * @param {string} nextPart
         * @param {boolean} add
         * @returns {*} 
         */
        getNext = function(current, nextPart, add)
        {
            return current[nextPart] || ( add && (current[nextPart] = {}) );
        },

        /**
         * Returns true if the given parameter is either a function or object
         *
         * @method isContainer
         * @expose
         * @param {*} current
         * @returns {*} 
         */
        isContainer=function (current)
        {
            var type = typeof current;
            return type && (  type == 'function' || type == 'object' );
        },

        /**
         * Gets an object from a string.
         *
         * @method getObject
         * @expose
         * @param {String} name the name of the object to look for
         * @param {Array} [roots] an array of root objects to look for the name
         * @param {Boolean} [add] true to add missing objects to
         *  the path. false to remove found properties. undefined to
         *  not modify the root object
         * @returns {String} 
         */
        getObject=function (objectName, roots, add)
        {
            //Production version:
            //var parts = objectName ? objectName.split(/\./) : [],

            var parts = objectName ? objectName.split(regs.dot) : [],
                length = parts.length,
                currents = m$.isArray(roots) ? roots : [roots || window],
                current,
                ret,
                i,
                c = 0,
                type;

            if (length == 0)
            {
                return currents[0];
            }
            while (current = currents[c++])
            {
                for (i = 0; i < length - 1 && m$.isContainer(current); i++)
                {
                    current = m$.getNext(current, parts[i], add);
                }
                if (m$.isContainer(current))
                {

                    ret = m$.getNext(current, parts[i], add);

                    if (ret !== undefined)
                    {

                        if (add === false)
                        {
                            delete current[parts[i]];
                        }
                        return ret;
                    }

                }
            }
        };

    //This is just trying to get it to save the names correctly. 
    //not really wanted. and not working anyway.
    m$.regs=regs;
    m$.getNext = getNext;
    m$.isContainer = isContainer;
    m$.getObject = getObject;   

})(M$['Core']);

并使用闭包编译器最小化，高级优化:

//So why did everything get renamed? Noot only was expose used,
//but I manually accessed the objects methods and property.
(function(b){
var h={undHash:/_|-/,colons:/::/,words:/([A-Z]+)([A-Z][a-z])/g,lowUp:/([a-z\d])([A-Z])/g,dash:/([a-z\d])([A-Z])/g,replacer:/\{([^\}]+)\}/g,dot:/\./};
b.e=h;
b.a=function(a,b,f){return a[b]||f&&(a[b]={})};
b.b=function(a){return(a=typeof a)&&("function"==a||"object"==a)};
b.d=function(a,d,f){a=a?a.split(h.c):[];
var k=a.length;
d=b.isArray(d)?d:[d||window];
var c,g,e,l=0;if(0==k)return d[0];
for(;c=d[l++];){for(e=0;e<k-1&&b.b(c);e++)c=b.a(c,a[e],f);
if(b.b(c)&&(g=b.a(c,a[e],f),void 0!==g))return!1===f&&delete c[a[e]],g}}
})(M$.Core);

Answer 1

我真的希望你能将完整的文本复制粘贴到某个地方(如果不在此处，则在 pastebin 或 jsfiddle 中)因为如果我一直不得不单击图片，则很难回答，记住我看到的，单击此窗口然后开始打字，点击图片提醒自己，点击这个窗口继续打字……点击图片确定等等。

无论如何，神秘的一点不是 f 更改为 J 或 h 更改为 J 而是G 更改为 J，regs 更改为 J。

如果你看下面的行，变量 f 和 h 只是赋值:

a.G = f;

从那时起，不再使用 f。现在，考虑到这一点，我假设在某个时候 a.G 或 a.regs 将分配给 Core.J。我进一步假设非闭包编译代码实际上是将 a.regs 分配给 Core.regs 但闭包编译器编译 Core.regs 到 Core.J 和 a.regs 到 a.G。

在代码的其余部分中搜索 a 中包含的值如何分配给 Core，您将得到答案。

---

附加答案:

如果你想强制关闭导出一些东西，你需要让安全地替换名称变得不可能。全局变量不能被安全地替换，因为它们可能被包含在页面中的另一个 js 文件使用。因此，如果您希望保留 regs，则通过删除 var 使其成为全局的。

或者，根据您的需要明确a 是全局的或Core 或M$ 是全局的。