今天剛做完網易校招的前端筆試題，總體難度不算很難，有送分題也有拉分題，不過大公司的筆試算法題占比最大，整套筆試題的題型與分值分布分別是：單選題40分共20題、編程題60分共3題、問答題20分共2題，是牛客網的筆試。

遇到一道比較坑的單選題，在此記錄一下。

以下代碼執行時console.log的結果是：

 1 var obj = {
 2   x: 1,
 3   xyz: function () {
 4       with(this) {
 5           function con () {
 6             console.log(x);
 7             console.log(this
 
.x);
 8           }
 9           var x = 2;
10           (function() {
11               con()
12           })()
13           con.call(this)
14       }
15   }
16 }
17 
18 obj.xyz()

執行結果：

要理解這道題就必須搞懂每一個this指向的是什麽，所以我們可以把對應的各個this打印出來分析一波

 1 var obj = {
 2   x: 1,
 3   xyz: function () {
 4       console.log(‘1‘, this
 
)
 5       with(this) {
 6         function con () {
 7           console.log(‘2‘, this)
 8           console.log(x);
 9           console.log(this.x);
10         }
11         var x = 2;
12         console.log(‘3‘, this);
13         (function() {
14           con()
15         })()
16         con.call(this
 
)
17       }
18   }
19 }
20 
21 obj.xyz()

執行結果如下：

從執行順序分析，1號this打印出來的是obj對象，也就是說with傳進去的是obj對象，在with代碼塊裏，首先聲明了con函數，然後再執行了var x=2；這一段代碼，而with修改了詞法作用域，把with代碼塊裏的上下文改為obj對象，那麽這段代碼等同於obj.x = 2，即把obj對象裏的x屬性修改為2，接著打印了3號this，值為obj對象，驗證了with代碼塊的上下文是obj對象。接著執行了一個立即執行函數，函數裏調用了con函數。在《你不知道的JavaScript上卷》第2章裏有提到函數裏this的綁定取決於函數的調用方式，而於函數聲明的位置無關，this的綁定規則有四個：默認綁定（獨立函數調用）、隱式綁定（obj.foo()）、顯示綁定（call()和apply()）和new綁定。顯然，立即執行函數裏直接調用con函數，屬於默認綁定，默認綁定this會指向全局對象(window或global)，所以第9行console.log(this.x)打印的是window.x，而全局對象window中並沒有定義x，因此打印出undefined，而第8行console.log(x)打印的是當前詞法作用域裏的x，即為obj.x，打印出2。接著分析第16行代碼con.call(this)相當於con.call(obj)，顯然，使用call()方法調用con函數，顯示綁定this指向obj，所以第9行console.log(this.x)打印的是obj.x，即為2，然後第8行同理打印的是當前詞法作用域裏的x。如此分析一波，這道題的答案就很清晰明了了。

前端筆試之2019網易校招