JavaScript 运算符

JavaScript 运算符

1. 什么是运算符

• 运算符 = 用于赋值
• 运算符 + 用于加值

2. 算术运算符

  <script>
    // + - * / %(取模或者求余)
    console.log(10 + 20); // 30
    console.log(10 - 20); // -10
    console.log(10 * 20); // 200
    console.log(10 / 20); // 0,5
    console.log(10 % 2); // 0

    // ++ -- 单独出现都是 自加1 或者 自减1
    // ++ 自增 1
    var a = 1;
    a++;
    console.log(a); // 2

    var b = 1;
    // 加加在后 先用后加（减减同理）
    console.log(b++); // 1
    console.log(b); // 2

    var c = 1;
    // 加加在前 先加后用（减减同理）
    console.log(++c); // 2
  </script>

3. 三元运算符

  <script>
    // 判断条件?语句一:语句二
    // 判断条件? 真的就执行语句1，假的话执行语句二
    var a = 1 > 2 ? "真" : "假";
    console.log(a); // 假
  </script>

4. 求奇偶数案例(利用三元运算符)

  <script>
    // 获取 input 元素的文本内容 inputDOM对象.value 属性
    // 获取按钮的 DOM 对象
    var btn = document.getElementById("btn");
    // 获取文本框的 DOM 对象
    var num = document.getElementById("num");
    // 给按钮添加点击事件
    btn.onclick = function () {
      var numValue = num.value;
      // 进行奇偶数的判断
      var result = numValue % 2 == 0 ? "偶数" : "奇数";
      // console.log(result);
      alert(numValue + "是：" + result);
      // if (text % 2 == 0) {
      //   console.log("偶数");
      // } else {
      //   console.log("奇数");
      // }
    };
  </script>

5. 赋值运算符

  <script>
    // 赋值运算符 =
    var a = 10;
    var b = 20;
    a += b; // a = a + b
    console.log(a); // 30
    a *= b; // a = a * b
    console.log(a); // 600
    a /= b; // a = a / 20
    console.log(a); // 30
  </script>

6. 用于字符串的 + 运算符

  <script>
    // 主要用于字符串的拼接
    txt1 = "What a very";
    txt2 = "nice day";
    txt3 = txt1 + txt2;
    console.log(txt3); // What a verynice day
  </script>

7. 比较运算符

  <script>
    // 比较运算符的返回值是一个 boolean 类型的值 true false
    // == 比较相等
    var a = 5 == 5;
    console.log(a); // true
    var b = 5 == "5"; // 只比较数值 不比较类型
    console.log(b); // true

    // === 比较值和类型
    var c = 5 === 5;
    console.log(c); // true
    var d = 5 === "5";
    console.log(d); // false

    // != 不等于 只比较值
    var e = 5 != 5;
    console.log(e);
    // !== 不等于 值和类型有一个不相等 或 两个都不相等
    var f = 5 !== "5";
    console.log(f); // true

    // < > <= >=
    console.log(10 < 5); // false
    console.log(10 > 5); // true
    console.log(10 <= 5); // false
    console.log(10 >= 5); // true
  </script>

8. 逻辑运算符

8.1 && 或 and

  <script>
    // && 短路与(and) 比较两个boolean的表达式
    // 当两个都为true，则都为true；如果有一个为false，则为false
    var a = 10 > 5; // 真
    var b = 10 < 5; // 假
    var c = a && b;
    console.log(c); // false

    var d = 10 > 3; // 真
    var e = a && d;
    console.log(e); // true

    var f = c && b;
    console.log(f); // false
  </script>

8.2 || 或 or

  <script>
    // || 短路或(or)
    // 比较两个boolean的表达式 当有一个为true，则结果为true；当两个都为false，则结果为false
    var a = 10 > 5; // 真
    var b = 10 < 5; // 假
    var c = a || b;
    console.log(c); // true
    var d = 10 < 3;
    var e = b || d;
    console.log(e); // false
  </script>

8.3 ! 或 not

  <script>
    // ! 逻辑非(not) 取反
    var x = 10 < 5; // 假
    var z = !x;
    console.log(z); // true
  </script>