編寫js/jQuery插件有一些約定俗成的套路，根據(jù)這些套路依葫蘆畫瓢，代碼的結(jié)構(gòu)上就不會(huì)出現(xiàn)太大的問(wèn)題了，特別推薦這個(gè)叫 javascript-patterns 的項(xiàng)目,一些demo讓我收獲良多。

基本結(jié)構(gòu)

普通的庫(kù)

用最基本的匿名函數(shù)實(shí)現(xiàn)即可

(function(){
    var root = this;
    root.YOURLIB = function(){
        FUNC1 : function(){},
        FUNC2 : function(){}
    }
}())

也可以使用call而不是使用閉包，此時(shí)兩種寫法等效，undersocre.js用的是call寫法

(function(){
    var root = this;
    root.YOURLIB = function(){
        FUNC1 : function(){},
        FUNC2 : function(){}
    }
}.call(this))

jQuery 插件###

通過(guò)一下方法可以使的插件可以 跨CMD/AMD/Browser

(function (factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(['jquery'], factory);
    } else if (typeof exports === 'object') {
        // CommonJS
        factory(require('jquery'));
    } else {
        // Browser globals
        factory(jQuery);
    }
}(function ($) {

    $.fn.render = function() {}
    $.render2 = function() {}
}))

當(dāng)然,如果不考慮Seajs,RequireJS的話,最方便的還是使用匿名函數(shù)，然后把window.jQuery當(dāng)成參數(shù)傳進(jìn)去

內(nèi)部組織

我們以 bootstrap-select v1.6.3,smooth-scroll這倆項(xiàng)目來(lái)進(jìn)行分析，

初始化###

一般的Library都會(huì)提供一套defaults配置文件，然后使用的時(shí)候和用戶自定義的settings進(jìn)行extend, smooth-scroll中的那種

settings = extend(defaults, options ||{})); 寫法就相當(dāng)贊，可以以一種十分簡(jiǎn)單的方式防止空指針異常。

剩下的就是根據(jù)業(yè)務(wù)劃分業(yè)務(wù)的funciton了，對(duì)于如何劃分，只有多加練習(xí)了。

另外，在注釋里像寫上 private 和 public 來(lái)區(qū)分對(duì)外接口和對(duì)內(nèi)接口是個(gè)不錯(cuò)的習(xí)慣。

i18n與配置管理###

i18n是吧那些國(guó)際話的字符全都放到defautls，比較優(yōu)雅的做法是defaults定義一個(gè)對(duì)象，這樣國(guó)際化文件
便能和原有的庫(kù)文件進(jìn)行分離，具體參考 bootstrap-datapicker

THE END