1

我正在编写一个新的 jQuery 插件。对于指南，我使用他们的建议：

(function( $ ){

  var methods = {
    init : function( options ) { 
      return this.each(function(){

        var $this = $(this),
          data = $this.data('tooltip'),
          tooltip = $('<div />', {
            text : $this.attr('title')
          });

          // If the plugin hasn't been initialized yet
          if ( ! data ) {
            data = {
               element : this,
               target : $this,
               tooltip : tooltip
            };
            $(this).data('tooltip', data);

          }
        methods.update.apply(data.element, 'Test');
    },
    update : function( content ) { 
      var $this = $(this),
         data = $this.data('tooltip');

        // check or change something important in the data.

        private.test.apply( data.element );

        return data.element;
    }
  };

  var private = {
      test: function() {
          var $this = $(this),
            data = $this.data('tooltip');

          // again, do some operation with data
      }
  };

  $.fn.tooltip = function( method ) {

    // Method calling logic
    if ( methods[method] ) {
      return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
    } else if ( typeof method === 'object' || ! method ) {
      return methods.init.apply( this, arguments );
    } else {
      $.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
    }    

  };

})( jQuery );

它与他们的版本略有不同，以使其更短，但也显示我的差异。基本上，在初始化中，我正在实例化和创建存储在元素中的数据对象。数据对象的一部分是元素本身：

element : this,

然后，在所有初始化完成后，我从 init 调用一个公共方法（假设我这样做是为了功能重用）。为了进行调用，我使用 .apply() 并提供适当的上下文（我的元素），当函数被外部​​调用时，它将匹配上下文：

return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));

这很好，可以理解。但是，我不确定的是从私有或公共方法中获取插件数据的性能。对我来说，似乎在每个公共和私有方法的顶部，我必须执行以下几行才能获取数据：

var $this = $(this),
     data = $this.data('tooltip');

当然，当我不需要存储在数据中的任何内容时，我不会执行它们。然而，我的插件执行了相当多的动画和状态跟踪，几乎所有的功能都需要访问数据。因此，似乎在几乎每个私人和公共调用中访问 .data() 都会对性能造成很大影响。

我的问题是是否有人使用这个插件结构（我希望是的，因为 jQuery 推荐它）并且找到了一种不同的引用数据的方法，而无需在每个函数调用中点击 .data() 。

4

0 回答 0