JavaScript逗号运算符 

阅读本文的前提,明确表达式、短语、运算符、运算数这几个概念。

所谓表达式,就是一个JavaScript的“短语”,JavaScript解释器可以计算它,从而生成一个值。表达式分为以下三种形式:

1)直接量:1.7是一个数字直接量,“JavaScript权威指南”是一个字符串直接量;

2)变量

3)复杂表达式:合并1)、2)中的表达式,创建比较复杂的表达式。例如:1.7是表达式,i是表达式,而1.7+i,也是表达式,它是两个简单表达式(一个直接量表达式,一个变量表达式)的和。在此例中,“+”是一个运算符,用于将两个简单表达式合并起来组成一个复杂的表达式。

所谓运算符和运算数?可根据运算数的个数来对运算符进行分类,一元运算符:只有1个运算数,如:-3中的“-”对运算数取反,只包含一个运算数,为一元运算符。二元运算符:有2个运算数,如“+”。三元运算符:包含3个运算数,将三个表达式合并成一个复杂的表达式,如“?"。

接下来进入正题...... 

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

逗号表达式:
           一般形式:表达式1,表达式2,表达式3,......表达式n

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

看下面几个例子:

1)x = 8*2, x*4; /*整个表达式为逗号表达式,它的值为64,x的值为16*/

2)(x = 8*2, x*4) , x*2; /*整个表达式为逗号表达式,它的值为32,x的值为16*/

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

请注意:并不是所有的逗号都要看成逗号运算符,如在函数调用时,各个参数是用逗号分隔开的,这里的逗号并不是逗号运算符。如:printf("%d, %d, %d", x, y, z);

4)如下代码所示

var a = 10,

    b = 20;

function CommaTest() {

    return a++, b++, 10;

}

var c = CommaTest();

alert(c); // 返回10

使用逗号运算符的场景归纳如下:

1. for循环中逗号运算符

逗号运算符的常见用法是在for循环的增量表达式中使用。例如:

var i,j=5,k;

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

    k = i + j;

}

在每次通过循环的结尾时,for语句只允许单个表达式被执行。逗号运算符允许将多个表达式视为单个表达式,因此这两个变量都递增。

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

在JavaScript中函数调用确实是函数调用运算符。它很特殊,因为其它编程语言资料中从来没有这个叫法。

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

接下来看一个逗号运算符和函数运算符冲突的例子以及解决的方法。

alert(2,5);  //

alert((2,5)); //

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

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

var a = 20;
var b = ++a, 10;
console.log(b);

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

再看几个示例,后两个示例略为奇葩。

示例一

console.log((0,9));  //

console.log((9,0));  //

if((9,0)) console.log("no");

if((0,9)) console.log("yes");  //yes

示例二:交换变量,无需第三个变量

var a = 'a', b = 'b';

//method1

a = [b,b=a][0];

//method2

a = [b][b=a,0];

分析:a = [b,b=a][0]中,[b,b=a]表示一维数组,[0]表示下标;a = [b][b=a, 0],其中[b]表示一维数组,[b=a, 0]中按逗号运算符处理,返回0,当做下标。

在这个例子中,我一直将在[b,b=a][0]和[b][b=a, 0]视作二维数组,这不对的。

一维数组形式:[1,2,3][0]   //取得值1

二维数组形式:[[1,2,3],[4,5,6]][1][1]     //取得值5

不过上述两种数组表示形式很少用。

示例三:简化代码,不过可读性差

if(x) {

    foo();

    return bar();

} else {

    return 1;

}

// equal to 

return x ? (foo(), bar()) : 1;

时间:2014-10-20

地点:合肥

引用:http://msdn.microsoft.com/zh-cn/library/ie/9b37css7(v=vs.94).aspx

http://www.feeldesignstudio.com/2013/09/javascript-comma-operator

http://www.cnblogs.com/pinocchioatbeijing/articles/2343736.html

JavaScript中的逗号运算符的更多相关文章

  1. 浅析JavaScript中的typeof运算符

    对JavaScript中的typeof运算符进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助. 如果typeof的运算符是数字.字符串或者布尔值,它返回的结果就是"numb ...

  2. JavaScript中涉及得运算符以及运算符的优先级

    在js中主要有三种运算符:算术运算符,逻辑与比较运算符,位运算符.在着三种运算符中,最常见的应该是算术与比较运算符,位运算符比较少见一些 *说到了运算符,就不得不说运算符的优先级.下面我来列一下这些运 ...

  3. C语言中关于逗号运算符的理解

    在C语言中运算符有很多,包括算数运算符.关系运算符.赋值运算符.位运算符.逻辑运算符.三目运算符.sizeof运算符.逗号运算符等等,那今天我们就重点来给大家讨论一下关于逗号运算符的一些运算规则. 首 ...

  4. JavaScript学习系列8 - JavaScript中的关系运算符

    JavaScript中有8个关系运算符,分别是 ===, !===, ==, !=, <, <=, >, >= 1. 恒等运算符 (===) ===也叫做 严格相等运算符,它要 ...

  5. JavaScript学习系列4 ----- JavaScript中的扩展运算符 三个点(...)

    在JavaScript中, ES6开始有rest参数 和 三个点扩展运算符 (spread运算符) 我们来看看他们各自的用处 1. rest参数 rest参数的形式为 ...变量名          ...

  6. js中的逗号运算符

    逗号运算符 逗号运算符是二元运算符,它的操作数可以是任意类型.它首先计算左操作数,然后计算右操作数,最后返回右操作数的值,用逗号运算符可以在一条语句中执行多个运算 作用: 1.在一条语句中从左到右执行 ...

  7. javaScript 中的布尔运算符 && 和 ||

    布尔运算符 && 和 ||的返回结果不一定是布尔值!由此来展开一定的研究及理解. 1.首先先介绍下常见的数据类型转化为bool后的值. (常用地方)在if表达式中,javascript ...

  8. Javascript中的位运算符和技巧

    ECMAScript 整数有两种类型,即有符号整数(允许用正数和负数)和无符号整数(只允许用正数).在 ECMAScript 中,所有整数字面量默认都是有符号整数,这意味着什么呢? 有符号整数使用 3 ...

  9. javascript中的instanceof运算符

    instanceof运算符希望左操作数是一个对象,右操作数表示对象的类:如果左侧的对象是右侧类的实例,则返回true,否则返回false.由于js中对象的类是通过初始化它们的构造函数来定义的,因此in ...

随机推荐

  1. (6) 深入理解Java Class文件格式(五)

    前情回顾 本专栏的前几篇博文, 对class文件中的常量池进行了详细的解释. 前文讲解了常量池中的7种数据项, 它们分别是: CONSTANT_Utf8_info CONSTANT_NameAndTy ...

  2. java解析json与map,list相互之间的转换

    运行这个类需要加载jar包:ezmorph-1.0.6.jar.json-lib-2.4-jdk15.jar.jsoup-1.6.1.jar.commons-beanutils-1.8.0.jar.c ...

  3. centos7 Nexus maven私有仓库

    cd /home wget http://www.sonatype.org/downloads/nexus-latest-bundle.tar.gz mkdir nexus tar zxvf nexu ...

  4. java编写一个可以上下移动的小球:运行后,可以通过上下左右键进行移动

    /* * 功能:加深对事件处理机制的理解 * 1.通过控制上下左右键,来控制一个小球的位置 */package com.test1;import java.awt.*;import javax.swi ...

  5. MXNet 学习 (1) --- 最易上手的深度学习开源库 --- 安装及环境搭建

    安装环境:Win 10 专业版 64位 + Visual Studio 2015 Community. 记录下自己在有GPU的环境下安装配置MXNet的过程.该过程直接使用MXNet release ...

  6. Oracle在归档模式下恢复

    =============== 数据库的完全恢复 =============== 在归档模式下数据库完全恢复时,数据库所经过的状态如下: 1.利用备份修复(Restores)损坏或丢失的数据文件,即将 ...

  7. Head First 设计模式 --8 模板方法模式 别找我,我会找你

    模板方法模式:在一个方法中定义一个算法的骨架,而将一些步骤延迟到子类中.模板方法使得子类可以在不改变算法结构的情况下,重新定义算法中的某些步骤.设计原则:1.封装变化2.多用组合少用集成3.针对接口变 ...

  8. 最精简的django程序

    一.程序框架 1.结构图

  9. python爬虫(1)

    了解python的基本语法后就可以开始了,边学边巩固. 学爬虫那什么是网络爬虫,以下是百度百科的定义:网络爬虫(又被称为网页蜘蛛,网络机器人, 在FOAF社区中间,更经常的称为网页追逐者),是一种按照 ...

  10. Caché数据库学习笔记(3)

    目录 Query函数及其测试 重建索引表 Management portal简介 远程访问Ensemble ============================================== ...