Before Coding [13] - js的表达式和运算符

必备知识:前面课程的学习

概述

本章主要介绍 JavaScript 的表达式和运算符,包括了赋值,比较,算数,按位,逻辑,字符串,三元等等。列举所有的运算符,但是不会全部讲解,只讲解实际编程中会用到的几种。

运算符(Operators)

JavaScript 拥有如下类型的运算符:

  • 赋值运算符
  • 比较运算符
  • 算数运算符
  • 按位运算符
  • 逻辑运算符
  • 字符串运算符
  • 条件 (三元) 运算符
  • 逗号运算符
  • 一元运算符
  • 关系运算符

JavaScript 拥有二元和一元运算符, 和一个特殊的三元运算符(条件运算符)。

一个二元运算符需要两个操作数,分别在运算符的前面和后面:

操作数1   运算符   操作数2
operand1 operator operand2

例如, 3+4xy*。

一个一元运算符需要一个在运算符前面或后面的操作数:

运算符    操作数
operator operand

操作数   运算符
operand operator

例如, x++++x

赋值运算符

一个赋值运算符赋一个基于它右边操作数值的值给它左边的操作数。最简单的赋值运算符是等于(=),将右边的操作数值赋给左边的操作数。那么 x = y 就是将 y 的值赋给 x

在下面的表格中列出了有一些为速记操作的复合赋值运算符:

名字 速记操作 等同于
赋值 x = y x = y
加法赋值 x += y x = x + y
减法赋值 x -= y x = x - y
乘法赋值 x *= y x = x * y
除法赋值 x /= y x = x / y
求余赋值 x %= y x = x % y
求幂赋值 x **= y x = x ** y
左移位赋值 x <<= y x = x << y
右移位赋值 x >>= y x = x >> y
无符号右移位赋值 x >>>= y x = x >>> y
按位与赋值 x &= y x = x & y
按位异或赋值 x ^= y x = x ^ y
按位或赋值 `x = y` `x = x y`

比较运算符

一个比较运算符比较它的操作数并返回一个机遇表达式是否为真的逻辑值。操作数可以是数字,字符串,逻辑,对象值。字符串比较是基于标准的字典顺序,使用 Unicode 值。在多数情况下,如果两个操作数不是相同的类型, JavaScript 会尝试转换它们为恰当的类型来比较。这种行为通常发生在数字作为操作数的比较。类型转换的例外是使用 ===!== 操作符,它们会执行严格的平等和非平等比较。这些运算符不会在检查想等之前转换操作数的类型。下面的表格描述了该示例代码中的各比较运算符:

var var1 = 3, var2 = 4;
运算符 描述 返回true的示例1 返回true的示例2
等于 (==) 如果两边操作数相等时返回true。 3 == var1 "3" == var1
不等于 (!=) 如果两边操作数不相等时返回true。 var1 != 4 var2 != "3"
全等于 (===) 两边操作数相等且类型相同时返回true。 3 === var1 4 === var2
不全等于 (!==) 两边操作数不相等或类型不同时返回true。 var1 !== "3" 3 !== '3'
大于 (>) 左边的操作数大于右边的操作数返回true。 var2 > var1 "12" > 2
大于等于 (>=) 左边的操作数大于或等于右边的操作数返回true。 var2 >= var1 var1 >= 3
小于 (<) 左边的操作数小于右边的操作数返回true。 var1 < var2 "2" < 12
小于等于 (<=) 左边的操作数小于或等于右边的操作数返回true。 var1 <= var2 var2 <= 5

算术运算符

算术运算符使用数值作为操作数并返回一个数值,标准的算术运算符就是加减乘除(+ - * /)。当操作数是浮点数时,这些运算符表现得跟它们在大多数编程语言中一样,例如:

console.log(1 / 2); /* prints 0.5 */
console.log(1 / 2 == 1.0 / 2.0); /* also this is true */

另外,JavaScript 还提供了如下的算术运算符:

求余(%

二元运算符,返回相除之后的余数。

如:13 % 5 返回 3

自增(++

一元运算符,将操作数的值加一。

如果放在操作数前面 (++x),则返回加一后的值;如果放在操作数后面 (x++),则返回操作数原值,然后再将操作数加一。

var x=3;
console.log(++x); //4
console.log(x); //4
var y=3;
console.log(y++); //3
console.log(y); //4

自减(--

一元运算符,将操作数的值减一。前后缀两种用法的返回值类似自增运算符。

var x=3; 
console.log(--x); //输出2
var y=3;
console.log(y--);//输出3

一元负值符(-

一元运算符,返回操作数的负值。

var x=3; 
console.log(-x); //输出-3

位运算符

位运算符有七种,了解即可,具体用法不作解释:

  • 按位与:a & b
  • 按位或:a | b
  • 按位异或:a ^ b
  • 按位反:~a
  • 左移:a << b
  • 右移:a >> b
  • 无符号右移:a >>> b

逻辑运算符

逻辑运算符常用于布尔(逻辑)值之间;当操作数都是布尔值时,返回值也是布尔值。 不过实际上&&||返回的是一个特定的操作数的值,所以当它用于非布尔值的时候,返回值就可能是非布尔值。 逻辑运算符的描述如下。

逻辑与(&&

对于expr1 && expr2,如果 expr1 能被转换为 false,那么返回 expr1;否则,返回 expr2 。因此,&&用于布尔值时,当操作数都为 true 时返回 true;否则返回 false。

var a1 =  true && true;     // t && t returns true
var a2 =  true && false;    // t && f returns false
var a3 = false && true;     // f && t returns false
var a4 = false && (3 == 4); // f && f returns false
var a5 = "Cat" && "Dog";    // t && t returns Dog
var a6 = false && "Cat";    // f && t returns false
var a7 = "Cat" && false;    // t && f returns false

逻辑或(||

对于expr1 || expr2,如果 expr1 能被转换为 true,那么返回 expr1;否则,返回 expr2 。因此,||用于布尔值时,当任何一个操作数为 true 则返回 true;如果操作数都是 false 则返回 false。

var o1 =  true || true;     // t || t returns true
var o2 = false || true;     // f || t returns true
var o3 =  true || false;    // t || f returns true
var o4 = false || (3 == 4); // f || f returns false
var o5 = "Cat" || "Dog";    // t || t returns Cat
var o6 = false || "Cat";    // f || t returns Cat
var o7 = "Cat" || false;    // t || f returns Cat

逻辑非(~

如果操作数能够转换为 true 则返回 false;否则返回 true。

var n1 = !true;  // !t returns false
var n2 = !false; // !f returns true
var n3 = !"Cat"; // !t returns false

条件运算符

条件运算符是 JavaScript 中唯一需要三个操作数的运算符。运算的结果根据给定条件在两个值中取其一。语法为:

condition ? val1 : val2

如果 condition 为 true,则结果取 val1。否则为 val2。你能够在任何允许使用标准运算符的地方使用条件运算符。

例如,

var status = (age >= 18) ? "adult" : "minor";

当 age 大于等于18的时候,语句将 “adult” 赋值给 status;否则将 “minor” 赋值给 status 。

运算符的优先级

运算符的优先级确定计算表达式时,他们的应用顺序。您可以通过使用括号改写运算符优先级。下表描述符的优先级,从最高到最低:

Operator type Individual operators
member . []
call / create instance () new
negation/increment ! ~ - + ++ -- typeof void delete
multiply/divide * / %
addition/subtraction + -
bitwise shift << >> >>>
relational < <= > >= in instanceof
equality == != === !==
bitwise-and &
bitwise-xor ^
bitwise-or ` `
logical-and &&
logical-or ` `
conditional ?:
assignment `= += -= *= /= %= <<= >>= >>>= &= ^= =`
comma ,

上表不需要死记硬背,遇到无法判断优先级的情况下使用括号即可。

表达式(Expressions)

表达式是代码的任何有效的单元解析为一个值。从概念上讲,有两种类型的表达式:

  • 将值分配给一个变量:如表达式 x=7
  • 仅仅有一个值:如代码 3 + 4

原文:《表达式和运算符》(From 《Before Coding》

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,189评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,577评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,857评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,703评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,705评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,620评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,995评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,656评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,898评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,639评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,720评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,395评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,982评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,953评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,195评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,907评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,472评论 2 342

推荐阅读更多精彩内容