切圖崽的自我修養-模塊插件化書寫方式

前言:

大體記一下模塊插件化的書寫思路ui


通常寫法:

define(function(require, exports, module) {

        var plugin = {
            
            //插件初始化入口
            init : function(options){
                var that=this;
                this.parameter1   = options.parameter1 || {};  //獲取傳入參數
                this.parameter2   = options.parameter2 || {};   //獲取傳入參數
                this.fun1  = options.fun1 || function(){};  //獲取傳入參數
                this.fun2 = options.fun2 || function(){};  //獲取傳入參數
                this.method1();
                ...
            }, 
            
            //插件公用方法1
            method1:function(){
                var that=this;
                ...
            },
    
            //插件公用方法2
            method2:function(){
                var that=this;
                ...
            },
                        
            ...
    
    }
        
        plugin.init(); //初始化插件
        module.exports = plugin;  //暴露模塊/方法
    });

調用方式:

var plugin = require('./plugin'); //引用模塊插件
plugin.method1();                 //調用插件公有方法

注意事項:

  • 插件初始化時,若是變量有缺省值, 通常用 || 邏輯this

  • 插件內私有變量私有方法一概加下劃線爲標識, 好比_parameter1表示私有變量, _fun1(){}表私有方法插件

  • 時刻謹記單一職責原則,一個基本方法只執行一個邏輯,若是有多個邏輯,請另外新增方法來對其餘基本的顆粒化的方法進行組合,這樣能夠下降複雜度,時刻保證整個插件的易讀性可擴展性code

相關文章
相關標籤/搜索