如何寫js前端插件

我之前都沒怎么寫過正式的插件，寫過的也都像之前的那些小插件，非常不正式。

突然想起自己都換了一個公司了，原來沒關系，這邊好歹也是個大公司，一定得注意規范了。於是網上搜索加咨詢超級大神的同學，得知了以下一些方法及規范。

---

 

由於我估計自己寫的是基於jquery的插件，所以先講一下最基礎的基於jquery的插件規范。

html：

<script type="text/javascript">
    $(function(){
        $("img").aaa();  //對哪個dom元素，調用aaa方法
    })
</script>

js：

(function ($) {
    $.fn.aaa = function(options) {  //fn.aaa，任意xx可調用aaa函數
        var dft = {
            //以下為該插件的屬性及其默認值
            height: "200px",
            width: "200px"
        };
        var ops = $.extend(dft,options);  //將options和dft進行拼接，組合成新的對象
        $(this).css("height",ops.height);
        $(this).css("width",ops.width);
    }
})(jQuery);

這是最簡單，也是最基礎的jquery的插件構成方法。

---

 

以下是插件的提升~~

“npm包管理，umd模塊，webpack打包，karma測試，用ES6寫，babel轉為ES5”------這是同學原話，我只是個搬運工。

包管理--npm：Nodejs自身提供了基本的模塊，但是開發實際應用過程中僅僅依靠這些基本模塊則還需要較多的工作。Nodejs庫和框架為我們提供了幫助，讓我們減少工作量。但是成百上千的庫或者框架管理起來又很麻煩，有了NPM，可以很快的找到特定服務要使用的包，進行下載、安裝以及管理已經安裝的包。