jQuery文件合并后里面的多个$(function() {});怎样去除？

Question

jQuery文件合并后里面的多个$(function() {});怎样去除？

比方说我有a.js,b.js,c.js
它们的内容最开始都要

$(function() {
//do sth in it
});

然后我用gulp把三个JS合并成一个了。。
但是里面的$(function() {});重复了3次。。。怎样能去除多余的只留一个？

Answer 1

这个不需要去除啊，$() 是 $(document).ready() 的简写，它是一个加入事件处理的方法，可以根据需要加入若干次，事件触发的时候按加入顺序依次执行。

不过如果你三个 $(function() {}) 内容一样，就应该考虑改进，有两种方法

方法1

用模块化的思想，把 $(function() {}) 放在一个初始化模块（单独的 .js）中，其它脚本引入即可。这样合并的时候这个就只会出现一次

方法2

如果没有采用模块化的思想，或者需要这三个 JS 单独也能执行，那么应该在 $(function() {...}) 内部，就是省略号那个地方，做一个初始化检查，比如

$(function() {
    var myModule = window.myModule = window.myModule || {};
    if (myMoudle.isInited) {
        return;
    }
    
    // 初始化操作
    myModule.isInited = true;
});