Question

我正在开发一个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)>
}]);

Answer 1

仔细查看错误。

Uncaught ReferenceError: name is not defined

表示你没有定义名称，因为你在strict mode，你不能在没有定义的情况下使用变量（通常如果你这样做，它将是一个全局变量，但不是严格的模式）。因此，如果您在它之前写了var name，则不会再出现此错误。

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

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

jQuery logger插件

1 个答案: