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


Posted in Javascript onJune 12, 2016

注意:

一、由于目前正在功读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中逗号运算符的用法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js控制的回到页面顶端goTop的代码实现
Mar 20 Javascript
jquery序列化表单去除指定元素示例代码
Apr 10 Javascript
jQuery选择器源码解读(六):Sizzle选择器匹配逻辑分析
Mar 31 Javascript
Javascript实现通过选择周数显示开始日和结束日的实现代码
May 30 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
Jun 03 Javascript
jQuery使用each方法与for语句遍历数组示例
Jun 16 Javascript
js简单实现图片延迟加载的方法
Jul 19 Javascript
js date 格式化
Feb 15 Javascript
webpack vue项目开发环境局域网访问方法
Mar 20 Javascript
解决node修改后需频繁手动重启的问题
May 13 Javascript
vue父子模板传值问题解决方法案例分析
Feb 26 Javascript
js前端设计模式优化50%表单校验代码示例
Jun 21 Javascript
Node.js Addons翻译(C/C++扩展)
Jun 12 #Javascript
基于JS代码实现当鼠标悬停表格上显示这一格的全部内容
Jun 12 #Javascript
jQuery的each循环用法简单示例
Jun 12 #Javascript
基于jquery插件编写countdown计时器
Jun 12 #Javascript
跨域请求的完美解决方法(JSONP, CORS)
Jun 12 #Javascript
浅谈jquery的map()和each()方法
Jun 12 #Javascript
Jquery 自定义事件实现发布/订阅的简单实例
Jun 12 #Javascript
You might like
全国FM电台频率大全 - 7 吉林省
2020/03/11 无线电
php获取目录所有文件并将结果保存到数组(实例)
2013/10/25 PHP
浅析PHP微信支付通知的处理方式
2014/05/25 PHP
PHP开发框架kohana3 自定义路由设置示例
2014/07/14 PHP
php实现根据身份证获取精准年龄
2020/02/26 PHP
基于jquery编写的横向自适应幻灯片切换特效的实例代码
2013/08/06 Javascript
javascript中html字符串转化为jquery dom对象的方法
2015/08/27 Javascript
jfinal与bootstrap的登录跳转实战演习
2015/09/22 Javascript
JavaScript操作XML/HTML比较常用的对象属性集锦
2015/10/30 Javascript
浅谈jquery设置和获得checkbox选中的问题
2016/08/19 Javascript
微信小程序 教程之小程序配置
2016/10/17 Javascript
js 原生判断内容区域是否滚动到底部的实例代码
2017/11/15 Javascript
Vue集成Iframe页面的方法示例
2017/12/12 Javascript
基于JavaScript实现简单的音频播放功能
2018/01/07 Javascript
Vue-axios-post数据后端接不到问题解决
2020/01/09 Javascript
[07:06]2018DOTA2国际邀请赛寻真——卫冕冠军Team Liquid
2018/08/10 DOTA
python发送邮件的实例代码(支持html、图片、附件)
2013/03/04 Python
Windows下的Jupyter Notebook 安装与自定义启动(图文详解)
2018/02/21 Python
python3.4.3下逐行读入txt文本并去重的方法
2018/04/29 Python
Flask框架踩坑之ajax跨域请求实现
2019/02/22 Python
django云端留言板实例详解
2019/07/22 Python
python pillow模块使用方法详解
2019/08/30 Python
numpy.random.shuffle打乱顺序函数的实现
2019/09/10 Python
python对Excel按条件进行内容补充(推荐)
2019/11/24 Python
使用Python内置模块与函数进行不同进制的数的转换
2020/04/26 Python
HTML5之SVG 2D入门10—滤镜的定义及使用
2013/01/30 HTML / CSS
阿迪达斯比利时官方商城:adidas比利时
2016/10/10 全球购物
SHEIN香港:价格实惠的女性时尚服装
2018/08/14 全球购物
2014年三万活动总结
2014/04/26 职场文书
班主任评语大全
2014/04/26 职场文书
企业文化宣传标语
2014/06/09 职场文书
十佳党员事迹材料
2014/08/28 职场文书
幼儿园感恩节活动总结
2015/03/24 职场文书
离婚案件被告代理词
2015/05/23 职场文书
2016教师学习教育法心得体会
2016/01/19 职场文书
python中的3种定义类方法
2021/11/27 Python