JavaScript基础篇运算符与表达式

JavaScript基础第二篇 —— 运算符/流程控制

回顾

上一篇我们学习了 js 的第一篇基础——变量，在看变量之前，简单的了解了计算机的组成部分和浏览器 的组成部分，在js中了解了最基本的声明变量和使用变量，以及转换字符串和转换数字类型等，还有小细节的 例如 typeof 检测变量等需要重点掌握的，基础需要不停的温习。

这次就来看看 js 中的运算符和流程控制的内容，慢慢的从基础就要开始深入到逻辑上的东西了。这些都是构成了未来工作当中不可或缺的一部分，也是刚毕业进入到公司最先了解公司业务的这一部分，打好基础对未来的工作中成长是非常迅速的。

运算符

算术运算符

算术运算符就是我们常用的 加、减、乘、除、取余等内容，不过在计算机的程序中首先记住一个问题：浮点数的运算是有精度的问题，尽量避免浮点之间的运算，不能拿浮点数进行相加或者相减

• 加法：+
• 减法：-
• 乘法：*
• 除法：/
• 取余：%

// + 号 操作
console.log(1 + 1)  // 2

// - 号 操作
console.log(5 - 3) // 2

// * 号 操作
console.log(1 * 2) // 2

// / 号 操作
console.log(4 / 2) // 2

// 判断一个数是否被整除
console.log(4 % 2 === 0) // true

// 浮点数不能进行 相加或者相减 因为有精度的问题
console.log(0.1 + 0.2) // 0.30000000000000004
console.log((0.1 + 0.2) === 0.3)  // 因为精度问题

注意：取余也是常用的符号

递增递减运算符

运算符写在前面 例如： ++num 表示（num+1）

前置递增： ++num （先加1然后将结果返回）

后置递增： num++ （先返回原值，然后加1）

前置递减： --num

可以自己在编辑器中尝试尝试。前置递增和后置递增在对变量值中运用是不一样的。

比较运算符

比较运算符是用来比较左边和右边两个变量或者值是否相等，在将来工作的业务会很常用if判断+比较运算符来判断是否执行某个选项。

• 大于：>
• 小于：<
• 大于等于：>=
• 小于等于：<=
• 相等：==
• 不相等：!=
• 不全等：!==
• 全等：===

// 判断是否大于一个数
var num = 5
if (4 < 5) {
  console.log('我被执行了')
}

// 可以自己在编辑器中尝试下以下操作符返回 true 还是 false
console.log('5' == 5)
onsole.log('5' === 5)
...
等等，可以自己在编辑器中试一试

不过需要注意的是 一个等于、两个等于、和三个等于分别代表的是什么

- = ： 一个等于代表赋值 例如： var num = 4

- == ： 两个等于代表判断两个是否相等

- === ： 三个等于代表 判断两边的值和数据类型是否完全相同

逻辑运算符

逻辑运算符中用的比较多的是逻辑或和逻辑与，这两者也是相当重要的一部分，在未来的工作上是非常常用的。因为牵扯到判断所以在未来 if (false && true) 这种类型的判断是非常常见。在逻辑运算符中逻辑中断（短路）也是一个非常状态

• &&：逻辑与（and）：逻辑与 && and 两个都是为 true的话结果才是true，只要有一侧为 false，结果就是false

对于逻辑与，逻辑中断形式如下：

如果第一个表达式的值为真，则返回第二个表达式

如果一个表达式的值为假，则返回第一个表达式（相当于第一为假的话，第二个不计算）

• ||：逻辑或（or）：逻辑或 || or 两侧都是false 的话结果才是false，只要有一侧是true 结果就是true

• ！： 逻辑非（not）：意思是取反，!true 表示 false，!false 表示true

短路运算符（逻辑中断）：短路运算原理：当有多个表达式（值）时，左边的表达式值可以确定结果时，就不再继续运算右边的表达式的值

赋值运算符

赋值运算符意思是对变量进行赋值，分为 =、+=、-=、*=、/=、%=等这些运算符，表示的是 赋值，不过需要注意的是

// 在赋值运算符值，需要格外注意简写的形式
// 乘除取余等 都可以这样简写
var = var + 1  可以简写为：  var += 1

运算符的优先级

1. 小括号 —— ()
2. 一元运算符 —— ++，–，！
3. 算术运算符 —— 先乘除后加减
4. 关系运算符 —— > >= < <=
5. 相等运算符 —— == != === !==
6. 逻辑运算符 —— 先 && 后 ||
7. 赋值运算符 —— =
8. 逗号 —— ，

逻辑与 要比 逻辑或的权重高

流程控制

流程控制可以想象成一个流程，如果这个流程中是 false 的话就不执行这个流程中的内容，如果是true 的话就执行这个流程中的内容，在流程控制中最重要的还是 if，当然也会少量的运用到 switch…case等，还有一个比较重要的三元表达式，在工作当中很常用。

分支语句 if

// 普通 if else 语句

if (true) {
  console.log('我被执行了')
} else {
  console.log('我没有被执行')
}

// if else if   else 
if (false) {
  console.log('我没有被执行')
} else if (false) {
  console.log('我也没有被执行了');
} else {
  // 因为前两段都是false ，所以执行了第三段
  console.log('我被执行了')
}

switch…case

switch语句和 if…else 语句比较的类似，也是执行判断逻辑。但是相比if语句不常用。因为if…else语句更灵活，效率更高一点。

// switch 表达式

switch (表达式) {
  case value1:
      执行语句1;
      break;
  case value2:
      执行语句2；
      break；
  default:
      执行最后的语句；
}

三元表达式

三元表达式相当于是对 if等判断语句的简写形式，工作中会常用三元表达式来做简单的判断，因为相对if和switch判断更多写在方法中，而三元表达式更多写在组件中。

一般是由这样的形式组成：num > 5 ‘是的’ : '不是’

// 三元表达式
var num = 10;
var result = num > 5 '是的' : '不是'
console.log(result)  // 是的

好了，今天对于运算符和表达式就内容了。还是希望好好学学基础，对于我自身也是。有什么问题可以留言相互讨论，共同进步！