逗号运算符简单的理解和运用

发表于 | 分类于

逗号运算符是指，多个表达式可以用逗号分开，其中用逗号分开的表达式的值分别结算，但整个表达式的值是最后一个表达式的值。

1.在函数当中的使用

1
2
3
4
5
6
7
8
var a = 15,
b = 20;
function CommaTest() {
    return b++ , 10, a++;
 }
var c = CommaTest();
console.log(c); // 返回15  
// 函数调用的时候，返回值以逗号运算符最后一位参数为基准，返回值。

2.for循环中逗号运算符

1
2
3
4
5
6
7
8
9
10
11
//在for循环当中，其逗号运算符的计算，以最后一个传入的参数为准进行计算
var i, j = 5, k;
for (i = 0; i < 10; i++ , j++) {
    k = i + j;
}
console.log(k)  // 返回23
for (var i = 0, j = 0, m = 0; i < 10, j < 20, m < 5; i++ , j++ , m++) {
    var k = i + j + m;
}
console.log(k)  // 返回12

3.逗号运算符与函数调用运算符的冲突

 // 由于逗号运算符在JavaScript中的优先级是最低的，因此函数运算符将先于逗号运算符运行，上述代码中第一个alert函数弹出2。 解决方法如第二个alert函数所示，加上括号，保证逗号运算符先运行。
如:alert(2, 5);//2
如:alert((2, 5));//5

4.逗号运算符和赋值运算符冲突

// 由于逗号运算符要求它的运算数为复杂表达式或简单 表达式（如变量或直接量），赋值运算符先于逗号运算符执行，使逗号运算符左边不是一个运算数或表达式，而是含有var关键字的语句，因此报错。解决方法：只需加上括号，即var b = (++a, 10)，保证逗号运算符先执行即可。
var a = 20;
var b = (++a, 10);
console.log(b);//21

案例测试
console.log((0, 9)); //9 (括号提升了逗号运算的等级，不加括号则输出的是0和9)
var a = ‘a’, b = ‘b’;
a = [b, b = a][0]; // b (前面的[]代表的一维数组，0代表的是索引，此处没有牵涉到逗号运算符)
a = [b][b = a, 0]; // b (前面[]代表的是一维数组，后面的[]根据加号运算符的原理，则指引为0)
[[1,2,3],[4,5,6]][1][1] // 5 (前面的是二维数组，后面的是第一个[]代表数组中的第一个索引，后面的[]代表的是二维护数组中的第一个的索引)