3

我正在开发一个 jQuery 插件，它允许您记录任何 javascript 类或对象。这个想法是覆盖对象内的每个函数，或函数的原型。

(function($)
{
    "use strict";

    $.log = function(object, logger)
    {
        if (!$.isFunction(logger))
        {
            logger = function(name, args)
            {
                console.log(name + "(" + $.makeArray(args).join(", ") + ")");
            };
        }

        var s = $.isFunction(object) ? object.prototype : object;

        for (name in s)
        {
            var fn = s[name];

            if ($.isFunction(fn))
            {
                s[name] = (function(name, fn)
                {
                    return function()
                    {
                        logger(name, arguments);
                        return fn.apply(this, arguments);
                    };
                })(name, fn);
            }
        }
    };
})(jQuery);

这似乎适用于记录单个插件。例如$.log($.ui.tabs);记录选项卡原型内的所有函数调用。

但是当我想记录所有 jQuery$.log($);时，它给了我一些参考错误。我不知道为什么我会收到这个错误。我的印象是它与任何一个this或正在传递的论点有关，但我不确定。

编辑：现在我想多了，这也可能是因为被覆盖的函数总是返回。

我创建了一个小提琴来演示这个问题：http: //jsfiddle.net/Sj6xN/4/

编辑：

这是我最终得到的代码，到目前为止工作完美：

(function($)
{
    "use strict";

    var Logger = function(options)
    {
        this.options = $.extend(this.defaults, options);
    };

    Logger.prototype = {
        defaults:
        {
            inherited: false,
            deep: false,
            logWriter: function(name, args)
            {
                console.log("CALL: " + name + "(" + $.makeArray(args).join(", ") + ")");
            }
        },
        augment: function(object)
        {
            var self = this;

            // Make sure this object is not already augmented
            if (object.__isAugmented__)
            {
                return;
            }

            // Set 'isAugmented' to prevent recursion
            object.__isAugmented__ = true;

            // Loop through the object
            for (var name in object)
            {
                var originalFunction = object[name];

                // If it's a function and the function is not inherited or 'inherited' is enabled augment it
                if ($.isFunction(originalFunction) && (object.hasOwnProperty(name) || self.options.inherited))
                {
                    // Wrap in self executing function so references to 'name' and 'orginalFunction' are maintained
                    object[name] = (function(name, originalFunction)
                    {
                        // If the function has a prototype and 'deep' is enabled augment that as well
                        if (self.options.deep && originalFunction.prototype)
                        {
                            self.augment(originalFunction.prototype);
                        }

                        var augmentedFunction = function()
                        {
                            // Execute log writer
                            self.options.logWriter(name, arguments);

                            // Call original function
                            return originalFunction.apply(this, arguments);
                        };

                        // Inherit prototype of original function
                        augmentedFunction.prototype = originalFunction.prototype;

                        // Return the augmented function
                        return augmentedFunction;
                    })(name, originalFunction);
                }
                // If it's a plain object and 'deep' is enabled augment that as well
                else if (self.options.deep && $.isPlainObject(originalFunction))
                {
                    self.augment(originalFunction);
                }
            }
        }
    };

    $.log = function(object, options)
    {
        var logger = new Logger(options);

        // If the object is a function use it's prototype, otherwise assume a plain object
        object = $.isFunction(object) ? object.prototype : object;

        // Augment
        logger.augment(object);
    };
})(jQuery);

可以这样使用：

$.log(<object or function> [,
{
    inherited: <bool>,
    deep: <bool>,
    logWriter: <function(name, args)>
}]);
4

1 回答 1

2

仔细看看错误。

Uncaught ReferenceError: name is not defined

意味着您尚未定义 name 并且由于您处于严格模式，因此您不能在不定义变量的情况下使用它（通常如果您这样做，它将是一个全局变量，但不是在严格模式下）。所以如果你var name在它之前写a，你就不会再收到这个错误了。

尽管没有 tab 方法还有另一个错误。另一个错误说tabs不是对象的方法，这是因为当你包装函数时，你没有继承原型，所以当用 new 调用函数时，它没有原型函数（tabs是其中之一） .

这是固定代码：http: //jsfiddle.net/Sj6xN/8/

于 2012-07-28T02:34:04.270 回答