JS基础之【各种运算符与运算符的优先级】

news2024/9/23 13:24:55

🚀 个人简介：某大型国企高级前端开发工程师，7年研发经验，信息系统项目管理师、CSDN优质创作者、阿里云专家博主，华为云云享专家，分享前端后端相关技术与工作常见问题~

💟 作者：码喽的自我修养🥰
📝 专栏：JavaScript基础 🎉

🌈 创作不易，如果能帮助到带大家，欢迎 收藏+关注 哦 💕

🌈🌈文章目录

算术运算符

赋值运算符

自增/自减运算符

比较运算符

逻辑运算符

运算符优先级

算术运算符

数字是用来计算的，比如：乘法 * 、除法 / 、加法 + 、减法 - 等等，所以经常和算术运算符一起。

算术运算符：也叫数学运算符，主要包括加、减、乘、除、取余（求模）等

注意：在计算失败时，显示的结果是 NaN （not a number）

// 算术运算符
console.log(1 + 2 * 3 / 2) //  4 
let num = 10
console.log(num + 10)  // 20
console.log(num + num)  // 20

// 1. 取模(取余数)  使用场景：  用来判断某个数是否能够被整除
console.log(4 % 2) //  0  
console.log(6 % 3) //  0
console.log(5 % 3) //  2
console.log(3 % 5) //  3

// 2. 注意事项 : 如果我们计算失败，则返回的结果是 NaN (not a number)
console.log('老师' - 2)
console.log('老师' * 2)
console.log('老师' + 2)   // pink老师2

赋值运算符

赋值运算符：对变量进行赋值的运算符

= 将等号右边的值赋予给左边, 要求左边必须是一个容器

<script>
let num = 1
// num = num + 1
// 采取赋值运算符
// num += 1
num += 3
console.log(num)
</script>

自增/自减运算符

++在前和++在后在单独使用时二者并没有差别，而且一般开发中我们都是独立使用

++在后（后缀式）我们会使用更多

注意：

只有变量能够使用自增和自减运算符

++、-- 可以在变量前面也可以在变量后面，比如: x++ 或者 ++x

<script>
    // let num = 10
    // num = num + 1
    // num += 1
    // // 1. 前置自增
    // let i = 1
    // ++i
    // console.log(i)

    // let i = 1
    // console.log(++i + 1) //3
    // 2. 后置自增
    // let i = 1
    // i++
    // console.log(i)
    // let i = 1
    // console.log(i++ + 1) //2

    // 了解 
    let i = 1
    console.log(i++ + ++i + i) //7
  </script>

比较运算符

使用场景：比较两个数据大小、是否相等，根据比较结果返回一个布尔值（true / false）

<script>
  console.log(3 > 5)
  console.log(3 >= 3)
  console.log(2 == 2)
  // 比较运算符有隐式转换 把'2' 转换为 2  双等号 只判断值
  console.log(2 == '2')  // true
  // console.log(undefined === null)
  // === 全等 判断 值 和 数据类型都一样才行
  // 以后判断是否相等 请用 ===  
  console.log(2 === '2')
  console.log(NaN === NaN) // NaN 不等于任何人，包括他自己
  console.log(2 !== '2')  // true  
  console.log(2 != '2') // false 
  console.log('-------------------------')
  console.log('a' < 'b') // true
  console.log('aa' < 'ab') // true
  console.log('aa' < 'aac') // true
  console.log('-------------------------')
</script>

注意：字符串比较，是比较的字符对应的ASCII码

从左往右依次比较
如果第一位一样再比较第二位，以此类推
比较的少，了解即可

注意：

NaN不等于任何值，包括它本身
涉及到"NaN“ 都是false
l尽量不要比较小数，因为小数有精度问题

不同类型之间比较会发生隐式转换
最终把数据隐式转换转成number类型再比较
所以开发中，如果进行准确的比较我们更喜欢 === 或者 !==

逻辑运算符

使用场景：可以把多个布尔值放到一起运算，最终返回一个布尔值

<script>
    // 逻辑与 一假则假
    console.log(true && true)
    console.log(false && true)
    console.log(3 < 5 && 3 > 2)
    console.log(3 < 5 && 3 < 2)
    console.log('-----------------')
    // 逻辑或 一真则真
    console.log(true || true)
    console.log(false || true)
    console.log(false || false)
    console.log('-----------------')
    // 逻辑非  取反
    console.log(!true)
    console.log(!false)

    console.log('-----------------')

    let num = 6
    console.log(num > 5 && num < 10)
    console.log('-----------------')
  </script>