【Java Script基础与提升】——运算符

最新推荐文章于 2023-02-04 18:04:17 发布

张小鱼༒

最新推荐文章于 2023-02-04 18:04:17 发布

阅读量216

点赞数 1

分类专栏： HTML以及CSS和javascripts 文章标签： html webview css javascript 开发语言

本文链接：https://blog.csdn.net/m0_56006701/article/details/125056121

版权

HTML以及CSS和javascripts 专栏收录该内容

8 篇文章 1 订阅

订阅专栏

JS基础之运算符

JS里面的数据类型之数字型的应用与基础知识

前言

运算符（operator）是应用于实现赋值、比较和执行算术运算等功能的符号。

提示：以下是本篇文章正文内容，下面案例可供参考

一、运算符的种类

共有五种常见的运算符：

1.算术运算符
2.递增递减运算符
3.比较运算符
4.逻辑运算符
5.赋值运算符

二、运算符详解

1.算术运算符

用于执行两个变量或者值之间的算术运算

示例代码如下：

<!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>
    <script>
        //算数运算符
        console.log(1+1);//2
        console.log(1/1);//1
        //取余数部分
        console.log(4%2);//0
        console.log(5%3);//2
        console.log(3%5);//3
        //浮点数在算术运算符里面会有问题
        console.log(0.1+0.2);//此处的结果不再是0.3，而是0.30000000000000004
        console.log(0.07*100);//7.000000000000001
        //不能直接拿浮点数来作比较
        var num=0.2+0.1;
        console.log(num == 0.3);//false
    </script>
</head>
<body>
    
</body>
</html>

2.递增递减运算符

需要反复给数字变量增加/减少1时，可以用递增递减运算符

有前置递增（递减）和后置递增（递减）两种类型

【这两种只能与变量配合使用】

前置：先己后人【先自加，后运算】

后置：先人后己【先原值运算，后自加】

开发时，一般使用后置递增递减，并且代码独占一行。

代码如下（示例）：

<!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>
    <script>
        //递增递减运算符
        //分前置和后置
        var age=10;
        ++age;//前置
        console.log(age);//11
        var p=10;
        console.log(++p+12);//23
        var q=10;
        q++;//后置：先返回原值，再自加1
        console.log(q);//11
        var w=10;
        console.log(w++ +10);//20
        console.log(w);//11

        //小的案例
        var a=10;
        ++a;//a=11
        var b=++a +2;//a=12
        console.log(b);//14

        var c=10;
        c++;//c=11
        var d=c++ +2;//c++=11 c=12
        console.log(d);//13

        var e=10;
        var f=e++ + ++e;//1、e++=10 e=11 2、e=12[e在前面的e的基础之上先自加1] ++e=12
        console.log(f);//22
    </script>
</head>
<body>
    
</body>
</html>

3.比较运算符

比较两个数据的大小，返回布尔值（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>
    <script>
        //比较运算符
        console.log(3>=5);//false
        console.log('eawd'=='sqSA');//false
        console.log(12==12);//true
        console.log(12=='12');//true[等号默认转换数据类型【只要求值相等】]
        console.log(12!=12);//false
        console.log(12===12);//true[全等要求两侧的值还有数据类型完全一样]
        console.log(12!=='12');//false
    </script>
</head>
<body>
    
</body>
</html>

4.逻辑运算符

用来进行布尔运算的运算符，返回值也是布尔值，多用于条件的判断

代码如下（示例）：

<!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>
    <script>
        //逻辑运算符
        //1、&&【与】两侧的都是true才是true否则为false
        console.log(3>5&&3>2);//false
        //2、||【或】两侧全为false才为false否则为true
        console.log(3>5||3>2);//true
        //3、！【非】
        console.log(!true);//false
    </script>
</head>
<body>
    
</body>
</html>

运算符中断的原理是左边的表达式值确定，不再继续判断右边的表达式

a、与

表达式1&&表达式2

表达式1为真，返回表达式2

表达式1为假，返回表达式1

<!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>
    <script>
        //逻辑运算符中断的情况【先看左边的表达式，再进行判断】
        //与&&   表达式1&&表达式2  表达式1为真，返回表达式2 表达式1为假，返回表达式1
        console.log(123&&345);//345
        console.log(0&&456);//0
        console.log(0&&1+1&&2+345);//0
        //0 中断的情况【如果有空或者否定的为假，其余是真的 0 '' null undefined NaN】
    </script>
</head>
<body>
    
</body>
</html>

b、或

表达式1 || 表达式2

表达式1为真，返回表达式1

表达式1为假，返回表达式2

<!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>
    <script>
        //或||   表达式1 || 表达式2  表达式1为真，返回表达式1 表达式1为假，返回表达式2
        console.log(123 || 456);//123
        console.log(123 || 234 || 1+23);//123
        console.log(0 || 234 || 1+23);//234

        //小的案例
        var num=0;
        console.log(123 || num++);//num++并没有执行[逻辑中断]
        console.log(num);//0
    </script>
</head>
<body>
    
</body>
</html>

5.赋值运算符

用来把数据赋值给变量的运算符

=、+=、-=、*=、/=、%=

代码如下（示例）：

<!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>
    <script>
        //赋值运算符
        var num1=10;
        num1+=2;
        console.log(num1);//12
        num1-=3
        console.log(num1);//9
        num1/=3
        console.log(num1);//3
        num1*=5;
        console.log(num1);//15
        num1%=7;
        console.log(num1);//1
    </script>
</head>
<body>
    
</body>
</html>

该处使用的url网络请求的数据。

6.运算符的优先级

优先级顺序：

总结

以上就是今天要讲的内容，本文仅仅简单介绍了Java script 当中运算符的使用，如果各位小伙伴有不明白的地方，可以在下方留言。

张小鱼༒

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
【Java Script基础与提升】——运算符

JS里面的数据类型之数字型的应用与基础知识运算符（operator）是应用于实现赋值、比较和执行算术运算等功能的符号。共有五种常见的运算符：用于执行两个变量或者值之间的1.算术运算符2.递增递减运算符3.比较运算符4.逻辑运算符5.赋值运算符6.运算符的优先级
复制链接

扫一扫