js中必须用分号的地方——由一个题目引起的思考

这篇文章是由一个题目引起的思考，那就先来看看题目

var myObject = {
    foo: "bar",
    func: function() {
        var self = this;
        console.log(this.foo);  
        console.log(self.foo);  
        (function() {
            console.log(this.foo);  
            console.log(self.foo);  
        }());
    }
};
myObject.func();

求这段代码输出什么
答案是：

bar
bar
undefined
bar

第三个为什么是undefined呢，这个就涉及到js中this的用法了，为了明显，我们修改一下输出的对象

var myObject = {
    foo: "bar",
    func: function() {
      var self = this;
      console.log(this.foo);  
      console.log(self.foo);
      (function() {
          console.log(this);
      })()
    }
}
myObject.func();

输出的结果：

bar
bar
Window {stop: ƒ, open: ƒ, alert: ƒ, confirm: ƒ, prompt: ƒ, …}

也就是说，this指向了window对象。熟悉this属性的都知道，this属性只有在函数执行的时候才能确定，指向调用函数的对象。而自执行函数，自动执行，虽然是在函数内定义的，调用函数的对象并不是myProject,所以this还是指向全局对象的。

题目说完了，现在来看一下遇到的问题。

当时我是想自己测试一下的，然后我就自己打了一遍代码，因为js可以不用分号，这也是我的个人习惯，所以这次就结结实实踩了个坑…说多了，看代码

var myObject = {
    foo: "bar",
    func: function() {
      var self = this
      console.log(this.foo)  
      console.log(self.foo)
      (function() {
      console.log(this.foo)
      console.log(self.foo)
      })()
    }
}
myObject.func()

运行结果呢？

bar
bar
Uncaught TypeError: console.log(...) is not a function

报错了，然后研究了好久都没有看懂，唯一区别就是分号，抱着试试看的态度，在自执行函数前面加了个分号，然后通过了。然后不服气，又写了个测试：

var selfarg = {
    name: "llx"
}

(function(arg, undefined) {
    console.log(arg)
})(selfarg)

不服不行，报错了Uncaught TypeError: (intermediate value) is not a function，加上分号就没问题了。他说接收的变量不是function，ok改成function

function selfarg() {
return {
        name: "llx"
    }
}

(function(arg) {
    console.log(arg)
})(selfarg)

console.log(selfarg)

方便对比，顺便直接打印了一下这个方法。打印成功了。

然后查了一下，在js中必须用分号的地方：

非第一行的+、-、/、()、[]开头时，前面要有分号