美文网首页
js插件通用写法

js插件通用写法

作者: 迪迪妮粑粑 | 来源:发表于2019-07-05 15:19 被阅读0次

    主要思想:
    1.创建js对象 -- 混合使用构造函数和原型模式
    2.闭包防止全局污染
    代码

    例子如下:没有具体实现什么,就写通用部分,备注应该够看了,函数体实现存在伪代码

    ;(function(window, document, undefined) {
        //这里的函数不会暴露给外界
        function hideFun(){
            return "函数不会暴露给外界";
        }
        
        // 创建一个构造函数
        function basicPlugin(params) {
            //默认参数
            this.options = {
                callBack: null
            }
    
            //调用原型的初始化函数
            this.init();
        }
    
        // 构造函数的原型对象,这里的函数会暴露给作用域实例化的对象
        basicPlugin.prototype = {
            // 初始化函数
            init: function() {
                this.doSomething();
    
                this.bindListeners();
            },
            doSomething: function() {
                var self = this;
                //函数的具体实现
                console.log("函数的具体实现");
            },
            bindListeners: function() {
                var self = this;
                // 添加各种监听
                
                console.log(hideFun())
                
                // 伪监听开始
                    //触发回调函数
                    if (self.options.callBack) {
                        self.options.callBack(inputValue);
                    }
                // 伪监听结束
            }
        }
        
        //将插件暴露到作用域
        if (typeof module !== "undefined" && module.exports) {
            module.exports = basicPlugin;
        } else if (typeof define === "function" && define.amd) {
            define(function() {
                return basicPlugin;
            });
        } else {
            window.basicPlugin = basicPlugin;
        }
    
    }(window, document))
    

    相关文章

      网友评论

          本文标题:js插件通用写法

          本文链接:https://www.haomeiwen.com/subject/ndlehctx.html