好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

JavaScript 算数运算符

JavaScript 算数运算符

算术运算符以数值(字面量或变量)作为其操作数,并返回 一个 单个数值。标准算术运算符是加法(+),减法( - ),乘法(*)和除法(/)。—— MDN

算数运算符是用来做算数运算的,如 + 这个符号,就是用来做加法操作。

1. N元运算

N 代表 一个 数,如一元运算,二元运算。

N元运算 表示由N个值产生 一个 新的值的规则。

如 * 就是 一个 二元运算符,他由两个数相乘产生第三个数。

JavaScript 中有三元运算符、二元运算符、一元运算符。

注意:网络上可以 搜索 到 JavaScript 中有更多元的运算,基本上都是使用三目(元)表达式嵌套来完成的,严格上说这不属于更多元的运算。

与算数相关的只有二元与一元运算符:

二元运算符:

+ 加法 - 减法 * 乘法 / 除法 % 求余 ** 幂 (ES2016 提案)

一元运算符:

+ 一元正号 - 一元负号 ++ 递增 -- 递减

2. 二元运算符

2.1 加法(+)

加法用来做求和,将 + 左右两边的数值相加,也可以用来连接字符串。

  var  num1  =   ; 
 var  num2  =   ; 

 var  total  =  num1  +  num2 ; 
console .  log  ( total )  ;   //  输出 :5 

 var  f irs tName  =   'hello'  ; 
 var  lastName  =   'world'  ; 

 var  name  =  f irs tName  +   ' '   +  lastName ; 
console .  log  ( name )  ;   //  输出 :"hello world" 
 

数字的加法就是和自然数学里的加法一样,做累加操作。

+ 碰到字符串就会把两边字符连接到一起,形成 一个 新的字符串。

2.2 减法(-)

减法操作是将 - 左边的数减去 - 右边的数,结果就是差值。

  var  totalApple  =   ;   // 一共有10个苹果 
 var  take  =   ;   // 小明拿走了四个苹果 

 var  left  =  totalApple  -  take ;   // 还有 10 - 4 个苹果 

console .  log  ( left )  ;   //  输出 :6 
 

2.3 乘法(*)

乘法操作将 * 左右两边的数相乘,结果就是积。

  var  result  =    *   ; 

console .  log  ( result )  ;   //  输出 :30 
 

2.4 除法(/)

除法操作将 / 左边的数作为被除数,右边的数作为除数,最后求出结果。

  var  result  =    /   ; 

console .  log  ( result )  ;   //  输出 :3 
 

在许多强类型的语言中,整数相除即便无法除尽,结果必然是整数,但在 JavaScript 中,整数相除如果无法除尽,也会返回小数部分。

 console .  log  (   /   )  ;   //  输出 :0.4 
 

上面这个结果在 Java 中会返回 0,但是在 JavaScript 中会反回 0.4。

注意:如果拿正负 0 作为除数,则结果会返回 Infinity 与 -Infinity。

2.5 求余(%)

求余事实上就是取模运算,也就是取余数。如 8 对 3 取模,结果为 2,按小学数学中的说法就是 8 除 3 得 2 余2 ,余2就是结果。

  var  result  =    %   ; 

console .  log  ( result )  ;   //  输出 :2 
 

2.6 幂(**)

幂是 ES2016 提供的新运算符,用来做乘方运算。

** 左边是底数,右边是指数,如 2 ** 3 按数学中的表示就是 2 3 ,即求 2 的 3 次方。

  var  total  =    **   ;   // 2 的 3次方,结果为 2 * 2 * 2 ,即8 

console .  log  ( total )  ;   //  输出 :8 
 

在 JavaScript 中的幂运算与其他语言有些许区别,规范中指出 禁止 使用带有歧义的幂运算表达式。

如底数前不能跟随一元运算符。

 console .  log  (  -   **   )  ;   // 在JavaScript会报错 
 

以上幂运算是会报错的,因为 JavaScript 无法知道是要在计算完 8 的 2 次方后求反,还是计算 -8 的 2 次方。

使用括号可以提供具体的意义,消除歧义:

 console .  log  (  (  -  )   **   )  ;   // -8的2次方 

console .  log  (  -  (   **   )  )  ;   // 计算完8的2次方后求反 
 

3. 一元运算符

3.1 一元正号

一元正号通常不参与数学运算,而是用作类型转换,一元正号可以很方便的将其他类型转换成数字。

  var  num1  =   +  ; 
 var  num2  =   +  '3'  ; 
 var  num3  =   +  true  ; 
 var  num4  =   +  false  ; 
 var  num5  =   +  null  ; 
 var  timestamp  =   +  new   Date  (  )  ;   // 直接得到时间戳 
 

3.2 一元负号

一元负号也可以将其他类型的数据转换成数字,但是转换完后会在前面 加上 负号。

  var  num1  =   -  ; 
 var  num2  =   -  '3'  ; 
 var  num3  =   -  true  ; 
 var  num4  =   -  false  ; 
 var  num5  =   -  null  ; 
 var  timestamp  =   -  new   Date  (  )  ; 
 

通常比较多的使用场景是对数字取反,让数值在正负值切换。

3.3 递增

递增操作会让数值本身 增加 1。

  var  num  =   ; 

num ++  ; 

console .  log  ( num )  ;   //  输出 :1 

num ++  ; 

console .  log  ( num )  ;   //  输出 :2 
 

这样看,递增操作有点像 x = x + 1 这种操作,其实只有在后置使用时的 效果 是和 x = x + 1 一样的,也就是 ++x 。

前置使用的时候,会先做递增操作,再返回数值。

后置使用时候,会先返回数值,再做递增操作。

  var  num  =   ; 

 var  total  =    +   ( num ++  )  ; 

console .  log  ( total ,  num )  ;   //  输出 :1 1 
 

这个是前置使用的情况,可以看到 num 的值是 1,total 的值也是 1,也就是说 total 再累加的时候为(1 + 0),这个时候 num 的值为 0,再这个值返回后对 num 进行了递增,所以 输出 num 结果为 1。

  var  num  =   ; 

 var  total  =    +   (  ++ num )  ; 

console .  log  ( total ,  num )  ;   //  输出 :2 1 
 

这个是后置使用的情况,total 输出 结果为 2,在求和的时候就是(1 + 2),num 是在递增后再被使用的。

3.4 递减

递增操作会让数值本身减去 1。

与递增一样,递减也具有前置使用与后置使用的情况。

  var  num  =   ; 
 var  total  =    +   ( num --  )  ; 

console .  log  ( total )  ;   //  输出 :2 

 var  num2  =   ; 
 var  total2  =    +   (  -- num )  ; 

console .  log  ( total2 )  ;   //  输出 :0 
 

4. 优先级

算术符的优先级与自然数学中的相似,按照 先乘除后加减 的规则来,具体的可以参考下表:

优先级 运算类型 符号 @H_ 502 _975@ 6 括号 ( … ) 5 后置递增 … ++ 后置递减 … -- 4 一元加法 + … 一元减法 - … 前置递增 ++ … 前置递减 -- … 3 幂 … ** … 2 乘法 … * … 除法 … * … 取模 … % … 1 加法 … + … 减法 … - …

括号 > 后置递增/后置递减 > 一元加法/一元减法/前置递增/前置递减 > 幂 > 乘法/除法/取模 > 加法/减法

可以见到,括号的优先级是最高的,所以建议在自己不确定优先级的时候,尽量使用括号决定优先级。

如:

  var  res  =    +    /    *    %    **   ; 
 

上面这个表达式的运算顺序,即便是知道优先级,也不是一眼就能看出来的,所以建议即便是知道优先级,也使用括号将计算顺序做区分。

将想要的计算顺序用括号包裹后:

  var  res  =    +   (  (  (   /   )   *   )   %   (   **   )  )  ; 
 

4. 小结

算数运算符主要参与运算,N 元运算就是用 N 个值产生 一个 新的值,运算符有自己的特性和优先级,当表达式较长的时候,建议使用括号包裹来控制执行顺序。

JavaScript 比较运算符 ? ?for 语句

查看更多关于JavaScript 算数运算符的详细内容...

  阅读:57次

上一篇

下一篇

第1节:什么是 JavaScript    第2节:学习环境准备    第3节:调试方案    第4节:JavaScript 变量    第5节:JavaScript 数据类型    第6节:JavaScript if 语句    第7节:for 语句    第8节:JavaScript 算数运算符    第9节:JavaScript 比较运算符    第10节:JavaScript 逻辑运算符    第11节:JavaScript 函数    第12节:JavaScript 表达式    第13节:JavaScript 对象    第14节:JavaScript 字符串    第15节:JavaScript 数字    第16节:JavaScript 数组    第17节:JavaScript switch 语句    第18节:JavaScript while 语句    第19节:JavaScript 的 break 与 continue    第20节:JavaScript with    第21节:document.cookie    第22节:JavaScript Function    第23节:JavaScript Math    第24节:JavaScript Date    第25节:JavaScript RegExp    第26节:JavaScript JSON    第27节:什么是 DOM    第28节:DOM 和 JavaScript 的关系    第29节:获取和操作 DOM 节点    第30节:DOM 与事件    第31节:DOM 事件绑定    第32节:DOM 事件对象    第33节:DOM 事件流    第34节:事件相关的优化    第35节:自定义事件    第36节:表单校验    第37节:什么是 BOM    第38节:常用的 BOM 相关对象    第39节:BOM 常用属性和方法    第40节:AJAX    第41节:异常处理    第42节:三元运算符    第43节:逗号操作符    第44节:void    第45节:typeof    第46节:delete 操作符    第47节:debugger    第48节:getter & setter    第49节:new 运算符与构造函数    第50节:JavaScript 原型    第51节:JavaScript instanceof    第52节:JavaScript this    第53节:严格模式    第54节:作用域    第55节:闭包    第56节:变量提升    第57节:对象包装器    第58节:Lodash    第59节:moment    第60节:swiper    第61节:ECMAScript 6    第62节:Node.js    第63节:Babel    第64节:CSS 预处理器    第65节:代码规范    第66节:TypeScript    第67节:WebComponents    第68节:Vue、React、Angular    第69节:小程序    第70节:JavaScript 关键字    第71节:分号导致的问题    第72节:对象属性访问问题    第73节:this 使用问题    第74节:浮点数精度问题    第75节:独一无二的 NaN    第76节:避免全局污染    第77节:控制台观察对象问题    第78节:根据环境选择语言特性    第79节:相关资源