浅谈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中逗号运算符的用法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • js利用与或运算符优先级实现if else条件判断表达式

    复制代码 代码如下: <script type="text/javascript"> /******************************************************************* 利用运算符优先级实现ifelse表达式 result = expression1 && expression2 当且仅当两个表达式的值都等于 True 时, result 才是 True. 如果任一表达式的值等于 False, 则 res

  • javascript运算符——位运算符全面介绍

    javascript运算符——位运算符全面介绍

    前面的话 位运算符是非常底层的运算,由于其很不直观,所以并不常用.但是,其速度极快,且合理使用能达到很好的效果.本文将介绍javascript中常常被忽视的运算符--位运算符 二进制表示 ECMAScript中的所有数值都以IEEE-754 64位格式存储,但位操作符并不直接操作64位的值,而是以32位带符号的整数进行运算的,并且返回值也是一个32位带符号的整数 这种位数转换使得在对特殊的NaN和Infinity值应用位操作时,这两个值都会被当成0来处理 如果对非数值应用位操作符,会先使用Num

  • 浅谈JavaScript中运算符的优先级

    运算符优先级 JavaScript中的运算符优先级是一套规则.该规则在计算表达式时控制运算符执行的顺序.具有较高优先级的运算符先于较低优先级的运算符执行.例如,乘法的执行先于加法. 下表按从最高到最低的优先级列出JavaScript运算符.具有相同优先级的运算符按从左至右的顺序求值. 运算符 描述 . [] () 字段访问.数组下标.函数调用以及表达式分组 ++ -- - ~ ! delete new typeof void 一元运算符.返回数据类型.对象创建.未定义值 * / % 乘法.除法.

  • 教你JS中的运算符乘方、开方及变量格式转换

    教你JS中的运算符乘方、开方及变量格式转换

    1)如何计算乘方 题一:3的4次方(不会打,请原谅 ==!!!) 3的4次方=3*3*3*3 var a = Math.pow(3,4); console.log(a); 说明:Math.pow()是用来计算乘方的语法 注意:Math的M是大写: 题二:3的4*5次方 var a =Math.pow(3,4*5); console.log(a); 2)如何计算根号 题目:根号81 var a = Math.sqrt(81); console.log(a); 变量格式转换 用户的输入 var ye

  • 浅谈JS运算符&&和|| 及其优先级

    今天看了一段YUI compressor压缩的js代码: userNum && (ind += index,ind >= userNum && (ind -= userNum),ind < 0 && (ind === -2 && (ind = -1),ind += userNum),selLi.removeClass("on"),$(selLi[ind]).addClass("on"));

  • javascript运算符——逻辑运算符全面解析

    前面的话 逻辑运算符对操作数进行布尔运算,经常和关系运算符一样配合使用.逻辑运算符将多个关系表达式组合起来组成一个更复杂的表达式.逻辑运算符分为逻辑非'!'.逻辑与'&&'.逻辑或'||'3种,本文将介绍这三种逻辑运算符 逻辑非 逻辑非操作符由一个叹号(!)表示,可以应用于ECMAScript中的任何值.无论这个值是什么数据类型,这个操作符都会返回一个布尔值.逻辑非操作符首先会将它的操作数转换成一个布尔值,然后再对其求反 逻辑非对操作数转为布尔类型的转换类型与Boolean()转型函数相同

  • 全面了解javascript三元运算符

    三元运算符: 如名字表示的三元运算符需要三个操作数. 语法是 条件 ? 结果1 : 结果2;. 这里你把条件写在问号(?)的前面后面跟着用冒号(:)分隔的结果1和结果2.满足条件时结果1否则结果2. <script type="text/javascript"> var b=5; (b == 5) ? a="true" : a="false"; document.write(" -----------------------

  • javascript运算符语法全面概述

    前面的话 javascript中的运算符大多由标点符号表示,少数由关键字表示,它们的语法言简意赅,它们的数量却着实不少.运算符始终都遵循着一些固定语法,只有了解并掌握这些内容,才能正确使用运算符.本文将主要介绍javascript运算符的语法概述 操作数个数 javascript的运算符总共有46个,如果根据其操作数的个数进行分类,则大多数是二元运算符(binary operator),它们的操作数都是两个,它们将两个表达式合并成复杂表达式 1 + 2; true || false; javas

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

    注意: 一.由于目前正在功读JavaScript技术,所以这里拿JavaScript为例.你可以自己在PHP中试试. 二.JavaScript语法比较复杂,因此拿JavaScript做举例. 最近重新阅读JavaScript权威指南这本书,应该说很认真的阅读,于是便想把所学的东西多记录下来.后 面本人将逐步写上更多关于本书的文章. 本文的理论知识来自于JavaScript权威指南,我这里做一下整理,或者说叫笔记. 如果你的基础够好的话,完全理解不成问题,但是如果读得有些郁闷的话,可以加我的QQ:

  • 浅谈js中的attributes和Attribute的用法与区别

    一:Attribute的几种用法和含义(attributes和Attribute都是用来操作属性的) getAttribute:获取某一个属性的值: setAttribute:建立一个属性,并同时给属性捆绑一个值: createAttribute:仅建立一个属性: removeAttribute:删除一个属性: getAttributeNode:获取一个节点作为对象: setAttributeNode:建立一个节点: removeAttributeNode:删除一个节点: 1.getAttrib

  • 浅谈js中的三种继承方式及其优缺点

    第一种,prototype的方式: //父类 function person(){ this.hair = 'black'; this.eye = 'black'; this.skin = 'yellow'; this.view = function(){ return this.hair + ',' + this.eye + ',' + this.skin; } } //子类 function man(){ this.feature = ['beard','strong']; } man.pr

  • 浅谈js中startsWith 函数不能在任何浏览器兼容的问题

    在做js测试的时候用到了startsWith函数,但是他并不是每个浏览器都有的,所以我们一般要重写一下这个函数,具体的用法可以稍微总结一下 在有些浏览器中他是undefined 所以我们可以这样的处理一下. if (typeof String.prototype.startsWith != 'function') { String.prototype.startsWith = function (prefix){ return this.slice(0, prefix.length) === p

  • 浅谈JS中的!=、== 、!==、===的用法和区别

    var num = 1; var str = '1'; var test = 1; test == num //true 相同类型 相同值 test === num //true 相同类型 相同值 test !== num //false test与num类型相同,其值也相同, 非运算肯定是false num == str //true 把str转换为数字,检查其是否相等. num != str //false == 的 非运算 num === str //false 类型不同,直接返回fals

  • 浅谈js数组和splice的用法

    首先添加一个splice函数: splice:该方法的作用就是从数组中删除一个元素 array.splice(index,count,value....); index:表示从哪一个下标开始, count:表示删除元素的个数 value:代表增加的元素 example: 1.var array = new Array(1,2,3,4,5,6); array.splice(0,1,2) result:2,2,3,4,5 2.var array = new Array(1,2,3,4,5,6); a

  • 浅谈js中调用函数时加不加括号的问题

    其实总结起来如下: 函数只要是要调用它进行执行的,都必须加括号.此时,函数()实际上等于函数的返回值.当然,有些没有返回值,但已经执行了函数体内的行为,这个是根本,就是说,只要加括号的,就代表将会执行函数体代码. 不加括号的,都是把函数名称作为函数的指针,用于传参,此时不是得到函数的结果,因为不会运行函数体代码.它只是传递了函数体所在的地址位置,在需要的时候好找到函数体去执行. 所以一般时候我们都是采用的是无括号的原因.这也是由于括号的二义性,因为括号是"函数调用运算符",相当于在执行

  • 浅谈js中的延迟执行和定时执行

    在js中,延迟执行函数有两种,setTimeout和setInterval,用法如下: function testFunction(){Console.log('hovertree.com');} setTimeout("testFunction()","6000"); //6000毫秒后执行testFunction()函数,只执行一次. setInterval("testFunction()","6000");//每隔600

  • 浅谈JS中的bind方法与函数柯里化

    绑定函数bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值.不同于call和apply只是单纯地设置this的值后传参,它还会将所有传入bind()方法中的实参(第一个参数之后的参数)与this一起绑定. 关于这个特性看<JS权威指南>原文的例子: var sum = function(x,y) { return x + y }; var succ = sum.bind(null, 1); //让this指向null,其后的实参也会作为实参传入被绑定的函数sum

  • 浅谈js中的in-for循环

    浅谈js中的in-for循环 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="jquery.js"></script> </hea

随机推荐