爱站程序员基地javaScript基础学习 – 5 – JavaScript运算符（操作符）-案例代码
- 1. 算数运算符
- 2. 表达式和返回值
- 3. 前置递增运算符
- 4. 后置递增运算符
- 5. 递增运算符练习
- 6. 比较运算符
- 7. 逻辑运算符
- 8. 逻辑运算符练习
- 9. 短路运算（逻辑中断）
- 10. 赋值运算符
- 11. 运算符优先级
1. 算数运算符
<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\"><title>Document</title><script>console.log(1 + 1); // 2console.log(1 - 1); // 0console.log(1 * 1); // 1console.log(2 / 13); // 0.6666666666666666// 1. % 取余 （取模）console.log(4 % 2); // 0console.log(5 % 3); // 2console.log(3 % 5); // 3// 2. 浮点数 算数运算里面会有问题console.log(0.1 + 0.2); // 0.30000000000000004console.log(0.07 * 100); // 7.000000000000001// 3. 我们不能直接拿着浮点数来进行相比较 是否相等var num = 0.1 + 0.2;console.log(num == 0.3); // false</script></head><body></body></html>
2. 表达式和返回值
<script>// 是由数字、运算符、变量等组成的式子 我们称为表达式 1 + 1console.log(1 + 1); // 2 就是返回值// 1 + 1 = 2// 在我们程序里面 2 = 1 + 1 把我们的右边表达式计算完毕把返回值给左边var num = 1 + 1;</script>
3. 前置递增运算符
<script>// 1. 想要一个变量自己加1 num = num + 1 比较麻烦var num = 1;num = num + 1; // ++numnum = num + 1;console.log(num); // 3// 2. 前置递增运算符 ++ 写在变量的前面var age = 10;++age; // 类似于 age = age + 1console.log(age);// 3. 先加1 后返回值var p = 10;console.log(++p + 10);</script>
4. 后置递增运算符
<script>var num = 10;num++; // num = num + 1 ++num;console.log(num);// 1. 前置自增和后置自增如果单独使用 效果是一样的// 2. 后置自增 口诀：先返回原值 后自加1var age = 10;console.log(age++ + 10);console.log(age);</script>
5. 递增运算符练习
<script>var a = 10;++a; // ++a 11 a = 11var b = ++a + 2; // ++a 12 a = 12console.log(a); // 12console.log(b); // 14var c = 10;c++; // c++ 11 c = 11var d = c++ + 2; // c++ = 11 c = 12console.log(d); // 13var e = 10;var f = e++ + ++e; // 1. e++ = 10 e = 11 2. e = 12 ++e = 12console.log(f); // 22// 后置自增 先表达式返回原值 后面变量再自加1</script>
6. 比较运算符
<script>console.log(3 >= 5); // falseconsole.log(2 <= 4); // true//1. 我们程序里面的等于符号 是 == 默认转换数据类型 会把字符串型的数据转换为数字型 只要求值相等就可以console.log(3 == 5); // falseconsole.log(\'小李子\' == \'东北F4\'); // flaseconsole.log(18 == 18); // trueconsole.log(18 == \'18\'); // trueconsole.log(18 != 18); // false// 2. 我们程序里面有全等 一模一样 要求 两侧的值 还有 数据类型完全一致才可以 trueconsole.log(18 === 18);console.log(18 === \'18\'); // false</script>
7. 逻辑运算符
<script>// 1. 逻辑与 && and 两侧都为true 结果才是 true 只要有一侧为false 结果就为falseconsole.log(3 > 5 && 3 > 2); // falseconsole.log(3 < 5 && 3 > 2); // true// 2. 逻辑或 || or 两侧都为false 结果才是假 false 只要有一侧为true 结果就是trueconsole.log(3 > 5 || 3 > 2); // trueconsole.log(3 > 5 || 3 < 2); // false// 3. 逻辑非 not ！console.log(!true); // false</script>
8. 逻辑运算符练习
<script>var num = 7;var str = \"一起来~学习~\";console.log(num > 5 && str.length >= num); // trueconsole.log(num < 5 && str.length >= num); // falseconsole.log(!(num < 10)); // falseconsole.log(!(num < 10 || str.length == num)); // false</script>
9. 短路运算（逻辑中断）
<script>// 1. 用我们的布尔值参与的逻辑运算 true && false == false// 2. 123 && 456 是值 或者是 表达式 参与逻辑运算？// 3. 逻辑与短路运算 如果表达式1 结果为真 则返回表达式2 如果表达式1为假 那么返回表达式1console.log(123 && 456); // 456console.log(0 && 456); // 0console.log(0 && 1 + 2 && 456 * 56789); // 0console.log(\'\' && 1 + 2 && 456 * 56789); // \'\'// 如果有空的或者否定的为假 其余是真的 0 \'\' null undefined NaN// 4. 逻辑或短路运算 如果表达式1 结果为真 则返回的是表达式1 如果表达式1 结果为假 则返回表达式2console.log(123 || 456); // 123console.log(123 || 456 || 456 + 123); // 123console.log(0 || 456 || 456 + 123); // 456// 逻辑中断很重要 它会影响我们程序运行结果var num = 0;console.log(123 || num++);console.log(num); // 0</script>
10. 赋值运算符
<script>var num = 10;// num = num + 1; num++// num = num + 2; // num += 2;// num += 2;num += 5;console.log(num);var age = 2;age *= 3;console.log(age);</script>
11. 运算符优先级
<script>// ++num !num 2 + 3console.log(4 >= 6 || \'人\' != \'阿凡达\' && !(12 * 2 == 144) && true)var num = 10;console.log(5 == num / 2 && (2 + 2 * num).toString() === \'22\');console.log(\'-------------------\');var a = 3 > 5 && 2 < 7 && 3 == 4;console.log(a);var b = 3 <= 4 || 3 > 1 || 3 != 2;console.log(b);var c = 2 === \"2\";console.log(c);var d = !c || b && a;console.log(d);</script>
