首页技术文章正文

Javascript中的数据类型和运算符

更新时间:2023-04-14 来源:黑马程序员 浏览量:

IT培训班

数据类型:

虽然js是弱数据类型的语言,但是js中也存在数据类型,js中的数据类型分为 :原始类型 和 引用类型,具体有如下类型。

 | 数据类型  | 描述                                               |
| --------- | -------------------------------------------------- |
| number    | 数字(整数、小数、NaN(Not a Number))              |
| string    | 字符串,单双引皆可                                 |
| boolean   | 布尔。true,false                                  |
| null      | 对象为空                                           |
| undefined | 当声明的变量未初始化时,该变量的默认值是 undefined |

使用typeof函数可以返回变量的数据类型,接下来我们需要通过书写代码来演示js中的数据类型

第一步:在VS Code中创建名为13. JS-基础语法-数据类型.html的文件

第二步:编写如下代码,然后直接挨个观察数据类型:

<!DOCTYPE html>
 <html>
 <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>JS-数据类型</title>
 </head>
 <body>
 
 </body>
 <script>
 
     //原始数据类型
     alert(typeof 3); //number
     alert(typeof 3.14); //number
 
     alert(typeof "A"); //string
     alert(typeof 'Hello');//string
 
     alert(typeof true); //boolean
     alert(typeof false);//boolean
 
     alert(typeof null); //object 
 
     var a ;
     alert(typeof a); //undefined
     
 </script>
 </html>

js的运算符

js中的运算符,js中的运算规则绝大多数还是和java中一致的,具体运算符如下:

 | 运算规则   | 运算符                                                       |
| ---------- | ------------------------------------------------------------ |
| 算术运算符 | + , - , * , / , % , ++ , --                                  |
| 赋值运算符 | = , += , -= , *= , /= , %=                                   |
| 比较运算符 | &gt; , < , >= , <= , != , == , ===   注意     == 会进行类型转换,=== 不会进行类型转换 |
| 逻辑运算符 | && , \|\| , !                                                |
| 三元运算符 | 条件表达式 ? true_value: false_value                         |

接下来我们通过代码来演示js中的运算法,主要记忆js中和java中不一致的地方

第一步:在VS Code中创建名为14. JS-基础语法-运算符.html的文件

第二步:编写代码

在js中,绝大多数的运算规则和java中是保持一致的,但是js中的\==和===是有区别的。

- \==:只比较值是否相等,不区分数据类型,哪怕类型不一致,==也会自动转换类型进行值得比较

- ===:不光比较值,还要比较类型,如果类型不一致,直接返回false

<!DOCTYPE html>
 <html>
 <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>JS-运算符</title>
 </head>
 <body>
     
 </body>
 <script>
      var age = 20;
      var _age = "20";
      var $age = 20;
     
      alert(age == _age);//true ,只比较值
      alert(age === _age);//false ,类型不一样
      alert(age === $age);//true ,类型一样,值一样
 
 </script>
 </html>

在js中,虽然不区分数据类型,但是有时候涉及到数值计算,还是需要进行类型转换的,js中可以通过parseInt()函数来进行将其他类型转换成数值类型。注释之前的代码,添加代码如下:

// 类型转换 - 其他类型转为数字
alert(parseInt("12")); //12
alert(parseInt("12A45")); //12
alert(parseInt("A45"));//NaN (not a number)

除此之外,在js中,还有非常重要的一点是:0,null,undefined,"",NaN理解成false,反之理解成true。注释掉之前的代码,添加如下代码:

 if(0){ //false
    alert("0 转换为false");
 }

浏览器刷新页面,发现没有任何弹框,因为0理解成false,所以条件不成立。注释掉上述代码,添加如下代码:

if(1){ //true
    alert("除0和NaN其他数字都转为 true");
}

浏览器刷新,因为1理解成true,条件成立,所以浏览器效果如下;

1681443565096_浏览器效果.png

分享到:
在线咨询 我要报名
和我们在线交谈!