关于js自执行函数报错的问题

Question

var kim = kim || {};
    kim.prototype = {
        init : function (obj, i) {
            console.log('Hello World')
        },

        closeWindow : function (obj1, obj2) {
            obj1.onclick = function () {
                obj2.style.display = "none"
            }
        }
    }

//调用

function lala(){
    var First = document.querySelector('.first'),
        firstBody = document.querySelector('.first_body'),
        Btn = document.querySelector('.btn'),
        btnBody = document.querySelector('.btnbody');
    var myFunc = kim.prototype;
    myFunc.init(First, firstBody);
    myFunc.closeWindow(Btn, btnBody);
}
lala();

这么调用没问题，但是写成以下自执行函数就报错

(function(){
    var First = document.querySelector('.first'),
        firstBody = document.querySelector('.first_body'),
        Btn = document.querySelector('.btn'),
        btnBody = document.querySelector('.btnbody');
    var myFunc = kim.prototype;
    myFunc.init(First, firstBody);
    myFunc.closeWindow(Btn, btnBody);
})()

新手不知道什么原理？不吝赐教，谢谢了

Answer 1

IIFE前面最好加上分号;

;(function(){
    var First = document.querySelector('.first'),
        firstBody = document.querySelector('.first_body'),
        Btn = document.querySelector('.btn'),
        btnBody = document.querySelector('.btnbody');
    var myFunc = kim.prototype;
    myFunc.init(First, firstBody);
    myFunc.closeWindow(Btn, btnBody);
})()

原因就在于代码压缩之后会出现以下情况：

// obj <obj>
var a = obj(function () {})()

这样就成了obj调用，就会报错，加上了分号

// obj <obj>
var a = obj;(function () {})();

这种尴尬就没有啦

Answer 2

在

var kim = kim || {};
    kim.prototype = {
        init : function (obj, i) {
            console.log('Hello World')
        },

        closeWindow : function (obj1, obj2) {
            obj1.onclick = function () {
                obj2.style.display = "none"
            }
        }
    }

后面加上分号。我估计是把后面的自调用的()当成传参数什么了。需要再确认一下。

Answer 3

我感觉问题可能是出现在没有等网页加载完成再去执行.你把你的那个自动执行的行数写在

$(funciton(){
    '你的自动执行函数';
});

Answer 4

分号真的好吝啬……

建议把document和kim传进IIFE里试试，写成这样：

(function(document, kim){
//blablabla...
})(document, kim)

Answer 5

估计这是JS的【变量提升】搞的鬼。
可以这样简单理解：

无论你变量或函数在什么地方定义，解析器都会默认将它们插放到当前作用域的最顶部，所以形象的叫它做“变量提升”。

这是我个人对这个概念形象的理解，希望对你有帮助

Answer 6

粗粗一看你的代码没任何问题，";"也没有问题，var之后同时声明多个变量本身就可以用","分割然后最后一个加";"，而且现在已经有很多人主张去掉";"了，我从16年下半年开始也不加分号了，感觉代码清爽不少。当然也有副作用，有时候会因为自动插入;出点bug，不过对有些经验的开发不是什么问题。
最后你这个代码在我的chrome下是可以的啊，不报错。

以我的代码知识来看你这个也没有任何问题，用括号括起来已经让解释器知道你这个是一个变量不是语句了，所以我认为代码是没什么问题的。从其他地方排查吧