JS里一个很少人知道的逗号操作符用法
你看过这样的代码吗?
let a = 1;
let b = 2;
let c = (a++, b++);
console.log(a, b, c);先不说结果,你猜猜a、b、c最后是多少?
答案是2、3、2。
这是怎么回事?
括号里面的逗号就是今天要说的逗号操作符。它会把里面的表达式从左到右一个个执行,然后返回最后一个表达式的结果。
所以上面那段代码的执行顺序是:
执行a++,a从1变成2
执行b++,b从2变成3
把b++的结果(也就是加之前的2)赋值给c
c拿到的是b自增前的值,所以c等于2。
再看个例子:
if(true, false, true) {
alert('hi')
}这个if判断会依次执行true、false、true,最后取最后一个值true,所以条件成立,会弹出提示框。
注意别搞混
JS里的逗号有三种用法,别弄混了:
数组里的逗号是分隔符:[3, 6, 2, 5]
函数参数里的逗号也是分隔符:setName(id, 'Tom')
今天说的逗号操作符,是在表达式里面用的,通常要写在括号里
只有括号里的才是逗号操作符,其他地方的都是分隔符。
逗号操作符的规律
说起来很简单:
a = (表达式1, 表达式2, 表达式3, ... , 最后一个表达式);
console.log(a); // 打印出来的是最后一个表达式的结果括号里的表达式会按顺序一个个执行,但最后只返回最后一个的值。
一个容易看懵的例子
我在网上看到过这样的代码:
if(a = 1, b = 2, c < 0){
console.log('ok');
}不熟悉的人可能一头雾水。其实这段代码就等于:
a = 1;
b = 2;
if(c < 0){
console.log('ok');
}先把a和b赋值,再用c去判断条件。
这东西有什么用?
说实话,日常工作里很少会主动用逗号操作符。因为它不太直观,别人看代码时要反应一下才知道什么意思。
但有一个地方你可能早就用过了,只是没注意。
for循环
for (let i = 0, j = 80; i < j; i++, j--) {
console.log(i, j);
}这里的i++, j--就用到了逗号操作符。每次循环结束,i加1,j减1,两个操作都会执行。
这个写法很常见,很多人每天都在用,只是没意识到这就是逗号操作符。
一个坑人的写法
看这个函数:
const func = () => {
let a = 7;
return a, 10;
}你觉得返回什么?
很多人以为返回a,也就是7。但逗号操作符会返回最后一个值,所以实际返回的是10。
这种写法特别容易坑人,看到的人可能要愣一下才能反应过来。所以写代码时最好不要这样用,容易给看代码的人添麻烦。
总结
逗号操作符就是用来在一个表达式里执行多个操作,然后只取最后一个的结果。
虽然平时不常用,但知道这个知识点有两个好处:
看别人代码时不会懵,特别是for循环里的写法
面试时如果被问到,能答得上来
不过写代码的时候建议别故意用这种写法。代码是给人看的,越清楚越好,没必要为了省一行代码让别人看得费劲。
本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!