你見過js中的逗號表達式嗎？這道逗號表達式的面試題，你能做對嗎？

前言

由于在看一些loader源碼的時候，第一次見到這種逗號表達式，覺得挺有意思的，于是就分享給大家，應(yīng)該也有很多同學(xué)也是第一次見吧。

概述

逗號操作符 對它的每個操作對象求值（從左至右），然后返回最后一個操作對象的值。

下面的代碼，只有最后一個表達式被返回，其他的都只是被求值。

function myFunc () {
  var x = 0;

  return (x += 1, x); // the same of return ++x;
}

console.log((1, 2)); // Returns 2 in console
console.log((a = b = 3, c = 4)); // Returns 4 in console

疑問

這么去做有什么好處嗎？難道就是改變我的寫法？把return ++x改成return (x +=1, x)？

答案當(dāng)然不是

進階

看下面的例子

var a = {
  foo: function() {
    console.log(this === window);
  }
};

a.foo(); // Returns 'false' in console
(0, a.foo)(); // Returns 'true' in console

看到?jīng)]，一個輸出false，一個輸出true，why？

在foo方法中，由于foo是a對象里的一個屬性，所以當(dāng)直接調(diào)用a.foo()的時候，就會打印false，因為this指代的是a。

但是，當(dāng)你執(zhí)行(0, a.foo)()的時候，這句實際上會返回一個foo方法。這個方法的this當(dāng)然是window了。相當(dāng)于返回的是下面這個方法，不屬于a的屬性

function() {
  console.log(this === window);
}

這個函數(shù)不再附加到任何東西，它this是全局對象window，所以輸出的是true。

經(jīng)典面試題

再來看一到很經(jīng)典的關(guān)于逗號表達式的面試題吧！

var i,j,k;
for( i = 0 , j = 0; i < 10 , j < 6; i++ , j++ ) {
  k = i+j;
}
document.write(k); //10

控制臺結(jié)果：

然后我把j修改成16.

for(var i = 0, j = 0; i < 10 , j < 16 ; i++ , j++){
  k = i + j;
    console.log('i='+i+'，j='+j+'k的結(jié)果是：'+k);
  }
console.log(k);//30

控制臺結(jié)果：

之前以為是需要同時滿足i<10和i<16才會繼續(xù)循環(huán)，而事實并非如此。

這個主要是逗號語句，當(dāng)有多個條件，之間用逗號隔開的時候，會返回最右側(cè)的條件”

引用文獻

“

• 逗號操作符 & (0, function)()：https://www.jianshu.com/p/cd188bda72df
• 一道js的前端面試題，主要弄清楚逗號表達式的作用: https://blog.csdn.net/weixin_30552811/article/details/98357394

”