五、JavaScript 运算符

最新推荐文章于 2024-09-14 15:26:51 发布

RedemptionQ。

最新推荐文章于 2024-09-14 15:26:51 发布

阅读量118

点赞数

文章标签： html 前端 javascript

本文链接：https://blog.csdn.net/qwe02315/article/details/130024454

版权

本文详细介绍了JavaScript中的各种运算符，包括算术运算符（如加、减、乘、除、幂、模），赋值运算符，一元运算符（正负号），自增自减运算符，逻辑运算符（非、与、或），关系运算符，相等运算符，以及条件运算符。文章还讨论了运算符的优先级和类型转换规则。

摘要由CSDN通过智能技术生成

运算符（操作符）

- 运算符可以用来对一个或多个值进行运算

1、算术运算符

+ 加法运算符

- 减法运算符

* 乘法运算符

/ 除法运算符

** 幂运算

% 模运算：两个数相除取余数

- 注意：

- 算术运算符时，除了字符中的加法。

其他运算符的操作数是非数值时，都会转换为数值然后再运算

<script>
    let a = 1 + 1
    a = 10 - 5
    a = 2 * 4
    a = 10 / 5
    a = 10 / 3
    a = 10 / 0 // Infinity
    a = 10 ** 4
    a = 9 ** .5 // 开方
    a = 10 % 2
    a = 10 % 3
    a = 10 % 4
    
    /*
        js 是一门弱类型语言，当进行运算时会通过自动的类型转换来完成运算
    */
    a = 10 - '5' // 10 -5
    a = 10 + true // 10 + 1
    a = 5 + null // 5 + 0
    a = 6 - undefined // 6 - NaN
    
    /*
        当任意一个值和字符串做加法运算时，它会先将其他值转换为字符串。
            然后再做拼串的操作
        可以利用这一特点来完成类型转换
            可以通过任何类型 + 一个空字符串的形式来将其转换为字符串
                其原理和String()函数相同，但使用起来更加简洁
        
    */

    a = 'hello' + 'world'
    a = '1' + 2 // "1" + "2"
    a = true

    a = true + ''

    console.log(typrof a, a);
</script>

2、赋值运算符

- 赋值运算符用来将以一个值赋值给一个变量

（1）、=

- 将符号右侧的值赋值给左侧的变量

（2）、??=

- 空赋值

- 只有当变量的值为 null 或 undefined 时才会对变量进行赋值

<script>
    let a = 10
    a = 5 // 将右边的值 赋值 给左边的变量
    let b = a // 一个变量只有在 = 左边时才是变量，在 = 右边时它时值
    
    a = 66
    a + 11 // 大部分的运算符都不会改变变量的值

    a = 5
    // a = a + 5
    a += 5 // 在 a 原来值的基础上增加5 

    a = undefined
    a ??= 101
    console.log(a)
</script>

3、一元正负

（1）、+ 正号

- 不会改变数值的符号

（2）、- 负号

- 可以对数值进行符号位取反

当我们对非数值类型进行正负运算时，会先将其转换为数值然后再运算

<script>
    let a = -10
    a = -a
    
    let b = '123'
    b = +b // b = Number(b)
    console.log(typeof b, b)
</script>

4、自增和自减

（1）、++ 自增运算符

- ++ 使用后会使得原来的变量立刻增加1

- 自增分为前自增(++a)和后自增(a++)

- 无论时 ++a 还是 a++ 都会使原变量立即增加1

- 不同的是 ++a 和 a++ 所返回的值不同

a++ 是自增前的值旧值

++a 是自增后的值新值

<script>
    let a = 10
    
    // let b = a++
    // console.log("a++ =" , b)

    let b = ++a
    // console.log("++a =",b)
    // console.log(a)

    let n = 5
    let result = n++ + ++n + n
    console.log(result) // 19
</scrupt>

（2）、- - 自减运算符

- -- 使用后会使得原来的变量立刻减少1

- 自减分为前自减(--a)和后自减(a--)

- 无论时 --a 还是 a-- 都会使原变量立即减少1

- 不同的是 --a 和 a-- 所返回的值不同

a-- 是旧值

--a 是新值

<script>
    let a = 5
    console.log('a--',a--) // a-- 5
    console.log(a)// 4
</script>

5、逻辑运算符

（1）、! 逻辑非

- ！可以用来对一个值进行非运算

- 它可以对一个布尔值进行取反操作

true --> false

false --> true

- 如果对一个非布尔值进行取反，它会先将其转换为布尔值然后再取反

可以利用这个特点将其他类型转换为布尔值

- 类型转换

转换为字符串

显式转换

String()

隐式转换

+ ""

转换为数值

显式转换

Number()

隐式转换

转换为布尔值

显式转换

Boolean()

隐式转换

<script>
    let a = true
    a = !a
    // console.log(a)
    a = 123

    a = !!a
    console.log(typeof a, a)
</script>

（2）、&& 逻辑与

- 可以对两个值进行与运算

- 当&&左右都为 true 时，则返回 true , 否则返回false

- 与运算时短路的与，如果第一个值为false,则不看第二值

- 与运算是找 false 的，如果找到 false 则直接返回，没有 false 才会返回 true

- 对于非布尔值进行运算，它会转换为布尔值然后进行运算

但是最终会返回原值

- 如果第一个值为 false ,则直接返回第一个值

如果第一个值为 true ,则返回第二值

<script>
    let result = true && true // true
    result = true && false // false
    result = false && true // false
    result = false && false // false
    
    //true && alert(123) //第一个值为true ,alert会执行
    false && alert(123)// 第一个值为false , alert不会执行

    //       true && true -> true
    result = 1 && 2 // 2
    //       true && false -> false
    result = 1 && 0 // 0
    //       false && false -> false
    result = 0 && NaN // 0    
    
    console.log(result)
</script>

（3）、|| 逻辑或

- 可以对两个值进行或运算

- 当 || 左右有 true 时，则返回 true, 否则返回 false

- 或运算也是短路的或，如果第一个值为 true，则不会看第二个值

- 或运算是找 true ，如果找到 true 则直接返回，没有 true 才会返回 false

- 对于非布尔值进行运算，它会转换为布尔值然后进行运算

但是最终会返回原值

- 如果第一个值为 true ,则直接返回第一个值

如果第一个值为 false ,则返回第二个值

<script>
    let result = true || false // true
    resulr = false || true // true
    resulr = true || true // true
    result = false || false // false


    // true || alert(123)// 第一个值为 true ,alert 会执行
    false || alert(123)// 第一个值为 false , alert 不会执行

     //       true || true -> true
    result = 1 || 2 // 1
    //       true || false -> true
    result = 1 || 0 // 1
    //       false || false -> false
    result = 0 && NaN // NaN
        
    console.log(result)
</scriprt>

6、关系运算符

- 关系运算符用来检查两个值之间的关系是否成立

成立返回 true，不成立返回 false

- 用来检查左值是否大于右值

- 用来检查左值是否大于等于右值

- 用来检查左值是否小于右值

- 用来检查左值是否小于等于右值

- 注意：

当对非数值进行关系运算时，它会先转换为数值然后进行比较

当关系运算符的两端是两个字符串，它不会将字符串转换为数值

而是逐位的比较字符串的 Unicode 编码

利用这个特点可以对字符串按照字母排序

注意比较两个字符串格式的数字时一定要进行类型转换

<script>
    let result = 10 > 5 //trur
    result = 5 > 5 // false
    result = 5 >= 5 // true

    result = 5 < '10' // true
    result = '1' > false // true

    result = 'a' < 'b' // true
    result = 'z' < 'f' // false
    result = 'abc' < 'b' // true
    
    result = '12' < '2' // true
    result = +'12' < '2' // false

    //检查 num 是否再 5 和 10 之间
    let num = 60
    //result = 5 < num < 10 // 错误的写法
    result = num > 5 && num < 10
    
    console.log(result)
</script>

7、相等运算符

- 相等运算符，用来比较两个值是否相等

- 使用相等运算符比较两个不同的类型的值时，

它会将其转换为相同的类型（通常转换为数值）然后再比较

类型转换后值相同也会返回 true

- null 和 undefined 进行相等比较时会返回 true

- NaN 不和任何值相等，包括它本身

<script>
    let result = 1 == 1 // true
    result = 1 == 2 // false
    result = 1 == '1' // true
    result = true == '1'// true
    
    result = null == undefined // true
    

    result = NaN == NaN // false         

    console.log(result)
</script>

===

- 全等运算符,用来比较两个值是否全等

- 它不会进行自动的类型转换，如果两个值的类型不同直接返回 false

<script>
    let result = 1 === '1'// false
    result null === undefined // false

    console.log(result)
</script>

- 不等,用来检查两个值是否相等

- 会自动的进行类型转换

<script>
    let result = 1 != 1// false
    result = 1 != '1'// false
    
    console.log(result)
</script>

!==

- 不全等，比较两个值是否不全等

- 不会自动的类型转换

<script>
    let result = 1 !== '1'// true
    console.log(result)
</script>

8、条件运算符(三元运算符)

条件运算符？表达式1 ：表达式2

- 执行顺序：

条件运算符再执行时，会先对条件表达式进行求值判断。

如果结果为 true，则执行表达式1

如果结果为 false,则执行表达式2

<script>
    let a = 19
    ler b = 20
    a > b ? alert('a大！')：alert('b大！')
    let max = a > b ? a : b
    
    alert(max)
</script>

9、运算符的优先级

和数学一样，JS中的运算符也有优先级，比如先乘除后加减

可以通过优先级的表格来查询运算符的的优先级

- 在表格中位置越靠上的优先级越高，优先级越高越先执行，优先级一样自左向右执行

优先级我们不需要记忆，甚至表格都不要看

因为()拥有最高的优先级，使用运算符时，如果遇到拿不准的，可以直接通过()来改变优先级即可

<script>
    let a = 1 + 2 * 3 // 7
    
    a = 1 && 2 || 3
        
    console.log(a)
</script>

RedemptionQ。

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫