JS 的运算符

76 阅读4分钟

JS 的运算符

算数运算符
  • 加+ 就是将 符号左右两边的值, 相加 得到一个新的值这个也叫做表达式, 表达式就是会计算出一个值, 然后参与周围程序的运行
    • 注意: + 一般是给数字使用的, 但是如果 符号的任意一边有字符串类型的, 那么不再计算求和, 而是计算一个拼接并且拼接后的值是字符串类型的
    • 这也是为什么 一个数据 + '' 能够转换为 字符串类型
        console.log(1 + 1)
        console.log(undefined + null)
        console.log(1 + '1')
  • 减- 就是将 符号两边的值 相减 得到一个新的值
    • 运算的时候, 如果符号两边有字符串. 那么 JS 会将 字符串转换为 数字 然后参与运算
    • 这也是为什么 数据 - 0 能够转换为 number 类型
        console.log(100 - 50)
        console.log('100' - 50)
  • * 就是将 符号两边的值 相乘 得到一个新的值
        console.log(100 * 5)
        console.log(100 * '5')
  • 除/ 就是将 符号两边的值 相除 得到一个新的值
        console.log(900 / 3)
        console.log(900 / '3')
  • 取余% 就是将 符号两边的值 相除 取余数
        console.log(9 % 4)
        console.log(9 % '4')
赋值运算符
  • 赋值号=
    • += 当要给一个变量重新赋值, 赋值为他本身加一个内容, 就可以使用 +=
        // +=
        var a = 100
        // a = a + 500
        a += 500
        console.log(a)


        // -=
        var b = 100
        // b = b - 50
        b -= 50
        console.log(b)

        // *=
        var c = 10
        // c = c * 10
        c *= 10
        console.log(c)

        // /=
        var d = 9
        d /= 3
        console.log(d)

        // %=
        var q = 9
        q %= 4
        console.log(q)
比较运算符
  • 大于 >
  • 小于 <
  • 大于等于 >=
  • 小于等于 <=
  • 等于 ==
    • 对比两边是否相等, 不会区分数据类型 了解或者特殊情况下书写
  • 等于 ===
    • 对比两边是否相等, 区分数据类型 推荐写 ===
    • 一定要注意, 等于 最少要两个 == 千万不要写成 =
  • 不等于
    • != 对比两边是否不相等, 不会区分数据类型
    • !== 对比两边是否不相等, 区分数据类型 推荐写 !==

        console.log(100 > 99)   // true
        console.log(100 < 99)   // false
        console.log(100 < 100)   // false
        console.log(100 > 100)   // false
        console.log(100 >= 100)   // true


        console.log(1 == 1) // true
        console.log(1 === 1)    // true

        console.log(1 == '1') // true
        console.log(1 === '1')    // false


        console.log(100 != 100)
        console.log(100 != 99)

        console.log(100 !== 100)
        console.log(100 !== '100')  // 因为区分数据类型, 所以 条件成立, 返回 true
        console.log(100 != '100')   // 不区分类型, 条件不成立, 返回 false

自增自减运算符

  • 自增++ 作用: 将变量自增1

    • 语法:
      1. 变量++
      2. ++变量
  • 自减-- 作用: 将变量自增减1

    • 语法:
      1. 变量--
      2. --变量
  • 区别:

    • 如果 符号 在 变量/数据 前, 先运算自增或者自减, 然后参与周围程序运算
    • 如果 符号 在 变量/数据 后, 先参与周围程序运算, 然后自增或者自减
        var num = 1
        // ++ 在前, 先运算
        console.log(++num)  // 2

        // ++ 在后, 后运算
        console.log(num++)  // 1
        console.log(num)     // 2

逻辑运算符

  • && 逻辑与 逻辑且
    • 语法: 变量1/数据1 && 变量2/数据2
    • 运行规则: 会判断符号左边的变量的值, 转换为布尔值后
    • 如果符号左边布尔值为 true, 那么运行符号右边的代码或者返回符号右边的代码
    • 如果符号左边布尔值为 false, 那么直接运行符号左边的代码或者返回符号左边的代码
        // 逻辑与 &&
        // console.log(变量1/数据1 && 变量2/数据2)
        console.log(true && false)
        console.log(1 && 0)
        console.log(0 && 100)
        console.log('手动分割线=================')
        
        console.log(true && false)
        /**
         *  按照逻辑与的规则, 符号左边的布尔值为 true 那么运行符号右边的代码, 或者返回符号右边的代码
         *  所以相当于写了: console.log(false)
        */
        console.log(0 && 100)
        /**
         *  按照逻辑与的规则, 符号左边的布尔值为 false 那么运行符号左边的代码, 或者返回符号左边的代码
         *  所以相当于写了: console.log(0)
        */
  • || 逻辑或
    • 语法: 变量1/数据1 || 变量2/数据2
    • 运行规则: 会判断符号左边的变量的值, 转换为布尔值后
    • 如果符号左边布尔值为 true, 那么运行符号左边的代码或者返回符号左边的代码
    • 如果符号左边布尔值为 false, 那么直接运行符号右边的代码或者返回符号右边的代码
        // 逻辑或 ||
        console.log(true || false)
        console.log(1 || 0)
        console.log(0 || 100)

        console.log(1 || 0)
        /**
         *  按照逻辑或的规则, 符号左边的布尔值为 true 那么运行符号左边的代码, 或者返回符号左边的代码
         *  所以相当于写了: console.log(1)
        */

        console.log(0 || 100)
        /**
         *  按照逻辑或的规则, 符号左边的布尔值为 false, 那么运行符号右边的代码, 或者返回符号右边的代码
         *  所以相当于写了: console.log(100)
        */
        true || console.log('左边为 true 右边就不会执行了')
        false || console.log('左边为 false 右边才会执行')
  • 逻辑与逻辑或 将来在分支语句中经常会使用 作为 判断条件
    • 逻辑与: 满足条件1 并且 满足条件2
    • 逻辑或: 满足条件1 或者 满足条件2
    • 逻辑非
      1. 得到数据的取反后的布尔值
      2. !undefined !true