Javascript範圍問題以高度可定製的插件模式

Question

我正在嘗試構建一個Javascript插件。它將是一個滑塊/旋轉木馬，可以爲每張幻燈片添加選項和操作。我知道已經有類似的插件了，但首先我想在構建插件時進行一些練習，然後我認爲根據需要擴展它可能更容易，如果需要的話。

它已經瞭解不同的設計模式，我認爲這會適合我的需要我在建設一個Javascript插件後第一次嘗試：http://markdalgleish.com/2011/05/creating-highly-configurable-jquery-plugins/

所以，我的HTML代碼將是這樣的：

<div class="container"> 
    <div class="item" data-step-in="stepin" data-step-out="stepout">item</div> 
    <div class="item" data-step-in="stepin2" data-step-out="stepout2">item</div> 
    <div class="item" data-step-in="stepin3" data-step-out="stepout3">item</div> 
</div> 

理想我想打電話給容器元素上的插件，並把它設置爲每個元素的所有選項：

$('.container').slider(); 

基本插件結構爲：

(function(window, $) { 
    var Plugin = function(elem, options) { 
    this.elem = elem; 
    this.$elem = $(elem); 
    this.options = options; 
    this.items = {}; 
    }; 

    Plugin.prototype = { 
    defaults: { 
     message: 'Hello world!', 
     itemsClass: '.item' 
    }, 
    init: function() { 
     this.config = $.extend({}, this.defaults, this.options); 

     $(this.config.itemsClass).each(function(i, obj) { 
     console.log(i, obj); 
     this.items[i][item] = obj; <--- problem! 
     }); 

     return this; 
    }, 
    }; 

    Plugin.defaults = Plugin.prototype.defaults; 

    $.fn.slider = function(options) { 
    return this.each(function() { 
     new Plugin(this, options).init(); 
    }); 
    }; 

    window.Plugin = Plugin; 
})(window, jQuery); 

在init功能我想遍歷項目，並存儲它們，所有的選項，在一個全局對象。這是我失敗的地方。在each週期內this指的是迭代的單個項目。那麼，從這裏開始，我怎麼在構造函數裏面提到this.items？這裏最好的方法是什麼？該用法的模式是否有誤？

Answer 1

Store中找到想要的變量，並從那裏調用this：

init: function() { 
     var that = this; 
     that.config = $.extend({}, that.defaults, that.options); 

     $(that.config.itemsClass).each(function(i, obj) { 
     console.log(i, obj); 
     that.items[i][item] = obj; <--- problem! 
     }); 

     return that; 
    }, 

即使this將根據範圍變更，that將保持一致，那麼你在函數開始將其設置爲