JavaScript 算术运算符
-
加减乘除以及取模（求余数）、++、–
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // + - * / console.log(10 + 20); // 30 console.log(10 - 20); // -10 console.log(10 * 20); // 200 console.log(10 / 20); // 0.5 // % 取模或者叫求余数 // 判断一个数的奇偶性 function parity(a) { if (a % 2 == 0) { console.log(a + "这个数是一个偶数"); } else { console.log(a + "这个数是一个奇数"); } } parity(11); </script> </html> -
三元运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // 三元运算符 // 判断条件?语句一:语句二 var a = 1 > 2 ? "真" : "假"; console.log(a); // 假 </script> </html> -
案例小知识
-
在一个表单输入框输入任意一个数字，通过点击按钮判断是否为奇偶数。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <input type="number" id="num" /> <button type="button" id="btn">求奇偶数</button> </body> <script> // 求奇偶数 // 获取按钮的 DOM 对象 var btn = document.getElementById("btn"); // 获取文本框的 DOM 对象 // 获取 input 元素文本框内容通过 value 属性 var num = document.getElementById("num"); btn.onclick = function () { var numValue = num.value; var result = numValue % 2 == 0 ? "偶数" : "奇数"; alert(result); }; </script> </html>
-
-
赋值运算法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // 赋值运算符 = var a = 10, b = 10, c = 10, d = 10, e = 10; // += -= /= *= %= b += 5; // b+5 在赋值给b b=b+5 c *= 5; // c*5 在赋值给c b=b*5 d /= 5; e %= 5; console.log(a, b, c, d, e); // 10 15 50 2 0 </script> </html> -
+和字符串的运算，做字符串的拼接 -
比较运算符
-
比较运算符的返回值 是一个
boolean类型的值[true、false] -
=比较值是否相等，不比较类型<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // 比较运算符的返回值 是一个boolean类型的值 [true、false] // = 比较相等 var a = 5 == 5; // 将 5==5 的比较结果赋值给a console.log(a); // true var b = 5 == "5"; // 只比较数值 不比较类型 console.log(b); // true </script> </html> -
===比较值是否相等，以及类型是否相等<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // === 比较值和类型 var c = 5 === 5; console.log(c); //true var d = 5 === "5"; console.log(d); //false </script> </html> -
!=不等于 -
!==不绝对等于<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // != 不等于 只比较值 var a = 5 != "5"; console.log(a); //false // !== 比较值以及类型 var b = 5 !== "5"; console.log(b); // true </script> </html> -
>、>=、<、<=<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // < > <= >= console.log(10 < 5); // false console.log(10 > 5); // true console.log(10 >= 10); // true console.log(10 <= 10); // true </script> </html>
-
-
逻辑运算符
-
&&相当于and<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // && 短路与 比较两个Boolean类型的表达式 // 当两个都为 true 则结果为 true // 当有一个false 则结果为 false // 当两个都为 false 则结果为 false var a = 10 > 5; // true var b = 10 < 5; // false var c = a && b; console.log(c); // false </script> </html> -
||相当于or<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // || 短路或 比较两个Boolean的表达式 // 当一个为 true 则结果为 true // 当两个都为 true 则结果为 true // 当两个都为 false 则结果为 false var a = true; var b = false; console.log(a || b); // true </script> </html> -
!<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body></body> <script> // ! 逻辑非 取反 var a = !true; console.log(a); // false </script> </html>
-
