浅谈JS中逗号运算符的用法

 更新时间:2016年06月12日 10:48:37   投稿:jingxian  
下面小编就为大家带来一篇浅谈JS中逗号运算符的用法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

注意:

一、由于目前正在功读JavaScript技术,所以这里拿JavaScript为例。你可以自己在PHP中试试。

二、JavaScript语法比较复杂,因此拿JavaScript做举例。

最近重新阅读JavaScript权威指南这本书,应该说很认真的阅读,于是便想把所学的东西多记录下来。后

面本人将逐步写上更多关于本书的文章。

本文的理论知识来自于JavaScript权威指南,我这里做一下整理,或者说叫笔记。

如果你的基础够好的话,完全理解不成问题,但是如果读得有些郁闷的话,可以加我的QQ:76863715

阅读本文的前提是,你能区分什么是表达式,什么是语句。还有明确运算符和运算数多是些啥东西。所

谓的表达式就是—— 一个JavaScript的“短语“,JavaScript的解释器可以计算它,从而生成一个值。表达式可

以分为以下三种:

1)直接量,如1.7是数字直接量、"JavaScript权威指南"是一个字符串直接量等。

2) 变量

直接量表达式的值就是这个直接量本身,变量表达式的值则是该变量所存放或引用的值。

3) 可以“合并”上面提到的“简单”表达式来创建为比较复杂的表达式。例如1.7是表达式,i也是表达式,下面的代码所示的同样也是(也可以叫)表达式:

i + 1.7

上面这个表达式的值是两个简单表达式(一个变量表达式和一个简单表达式)的和。在此例中,“+”是一个运算符,用于将两个简单表达式合并起来以组成一个复杂的表达式。

运算数的个数

可 以根据运算符需要的运算数的个数对运算符进行分类,大多数运算符都是二元运算符,它们把两个“表达式”合并成一个复杂的表达式。简而言之,就是它有两个运 算数。此外,JavaScript还支持大量的一元运算符,它能将一个表达式转换成另一个更复杂的表达式。如表达式-3中,运算符“-”就是一元运算符, 它执行操作是对运算数取反。

JavaScript还支持三元操作符“?:”,它可以将三个表达式合并为一个复杂的表达式。

OK,下面开始讲解逗号运算符。

逗号运算符,它将先计算左边的参数,再计算右边的参数值。然后返回最右边参数的值。

原书举的例子不太好,无法解释上面那句话,这里另外提供一个:

<script>
var a = 10, b = 20;

function CommaTest(){
return a++, b++, 10;
}

var c = CommaTest();

alert(a); // 返回11
alert(b); // 返回21
alert(c); // 返回10

</script>

变量c的值是函数CommaTest返回的值,而a和b多加1了。

逗号运算符和函数调用运算符的冲突

在JavaScript中,函数调用确实是函数调用运算符。它很特殊,因为其它编程语言资料中多从来没有这个叫法的。然后,(才是)它没有固定数目的运算数。

函数调用运算符的第一个参数是一个函数名或者是一个引用函数的表达式,其后是括号()。括号中间可以是数目不定的运算符,这些运算数可以是任意的表达式,它们之间用逗号隔开。

函数调用运算符将计算它的每一个运算数,第一个运算数指定为函数名(括号前),而括号中间的所有运算数的值将传递给这个函数作为函数的参数。

例如:

document.close()
Math.sin(x)
alert("Welcome " + name)
Date.UTC(2000, 11, 31, 23, 59, 59)
funcs.f(funcs.args[0], funcs.args[1])

知道了调用函数运算符后,我们举个例子说明关于如何处理它们冲突的事。

<script>
alert(2*5, 2*4); // 输出10
</script>

上面这段代码输出10,但是如果根据逗号运算符的原理来解释的话,那应该是输出8才对。为什么呢?

因为逗号运算符在JavaScript在的优先级是最底的,记住这一点非常有用。所以函数调用运算符将先于逗号运算符运行。结果alert函数输出第一个参数的值。将上面的代码修改成如下所示即可。

<script>
alert((2*5, 2*4)); // 返回8
</script>

逗号运算符和赋值运算赋的冲突

在JavaScript中,逗号运算符的优先级比赋值运算符还要底。请看下面的代码。

<script>
var a = 20;
var b = ++a,10;
alert(b);
</script>

这段代码似乎不能运行,可能是由于赋值运算符优先于逗号表达式运行,如果将代码改成

<script>
var a = 20;
var b = (++a,10);
alert(b);
</script>

即可了。

上面说到的“可能”我们这里做一下解释,这是本人的一些看法,不一定权威。

逗号运算符要求它的运算数是一个复杂的表达式或简单的表达式(如变量或直接量),但由于赋值运算符优先于逗号运算符执行,因此变成左边不是一个运算数或一个表达式,而是一个含有var关键字的语句

之前不能执行的代码可以看成如下代码:

<script>
var a = 20;
(var b = ++a),10;
alert(b);
</script>

语句中有表达式语句,但不是所有的语句都是表达式。

#################################################

一、逗号运算符的特性及作用

逗号运算符的作用是将若干表达式连接起来。它的优先级别在所有运算符中是最低的,结合方向是"自左至右"的。

如:3*3,4*4

二、逗号表达式

逗号表达式的一般形式是:表达式1,表达式2,表达式3……表达式n

逗号表达式的求解过程是:先计算表达式1的值,再计算表达式2的值,……一直计算到表达式n的值。最后整个逗号表达式的值是表达式n的值。

看下面几个例子:

x=8*2,x*4 /*整个表达式的值为64,x的值为16*/

(x=8*2,x*4),x*2 /*整个表达式的值为128,x的值为16*/

x=(z=5,5*2) /*整个表达式为赋值表达式,它的值为10,z的值为5*/

x=z=5,5*2 /*整个表达式为逗号表达式,它的值为10,x和z的值都为5*/

逗号表达式用的地方不太多,一般情况是在给循环变量赋初值时才用得到。所以程序中并不是所有的逗号都要看成逗号运算符,尤其是在函数调用时,各个参数是用逗号隔开的,这时逗号就不是逗号运算符。

如:printf(" %d,%d,%d",x,y,z);

###################################################

运算符使它两边的表达式以从左到右的顺序被执行,并获得右边表达式的值。, 运算符最普通的用途是在 for 循环的递增表达式中使用。例如:

for (i = 0; i < 10; i++, j++)
{
k = i + j;
}

每次通过循环的末端时, for 语句只允许单个表达式被执行。, 运算符被用来允许多个表达式被当作单个表达式,从而规避该限制。

以上这篇浅谈JS中逗号运算符的用法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 挺实用的20个JavaScript简化写法代码技巧

    挺实用的20个JavaScript简化写法代码技巧

    掌握一些JavaScript的精简书写方式,有助增强代码的阅读性,提升代码质量,任何一种编程语言的简写小技巧都是为了帮助你写出更简洁、更完善的代码,让你用更少的编码实现你的需求
    2023-08-08
  • JavaScript 学习笔记(四)

    JavaScript 学习笔记(四)

    今天继续学习JS中的对象,昨天学完了本地对象中的两个重要对象Array和Date。今天看下内置对象Global对象和Math对象。
    2009-12-12
  • JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)

    JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)

    这篇文章主要介绍了仿微信(电话)联系人列表滑动字母索引实例,通过for循环进行判断,具体操作步骤大家可查看下文的详细讲解,感兴趣的小伙伴们可以参考一下。
    2017-08-08
  • DWR内存兼容及无法调用问题解决方案

    DWR内存兼容及无法调用问题解决方案

    这篇文章主要介绍了DWR内存兼容及无法调用问题解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-10-10
  • 小程序实现单选多选功能

    小程序实现单选多选功能

    这篇文章主要为大家详细介绍了小程序实现单选多选功能,可自定义样式,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-11-11
  • JS控制弹出新页面窗口位置和大小的方法

    JS控制弹出新页面窗口位置和大小的方法

    这篇文章主要介绍了JS控制弹出新页面窗口位置和大小的方法,实例分析了open方法弹出窗口的使用技巧,需要的朋友可以参考下
    2015-03-03
  • js实现随机点名功能

    js实现随机点名功能

    这篇文章主要为大家详细介绍了js实现随机点名功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • HTML中事件触发列表与解说

    HTML中事件触发列表与解说

    HTML中事件触发列表与解说...
    2007-07-07
  • JS 连接MQTT的使用方法

    JS 连接MQTT的使用方法

    这篇文章主要介绍了JS 连接MQTT的使用方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-01-01
  • 微信小程序多列选择器range-key使用详解

    微信小程序多列选择器range-key使用详解

    这篇文章主要为大家详细介绍了微信小程序多列选择器range-key的使用方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08

最新评论