javascript中undefined与null一些容易出错的地方

原创 Laughing  2017-08-03 13:12  阅读 45 次 评论 0 条

javascript中我们经常会用到undefined以及null,这两种类型还是存在区别的。之前因为在项目中一些特殊的地方涉及到判断是undefined还是null,结果就出现了一些问题。

基础概念

  1. Undefined类型只有一个值,即undefined。当声明的变量还未被初始化时,变量的默认值为undefined
  2. Null类型也只有一个值,即nullnull用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象。

使用区别

我们使用if判断nullundefined是否相等时,if语句返回true,如果我们必须区分两种类型,可以使用===进行比较,或者通过typeof获取到数据类型,然后用==进行判断。

  1. <!DOCTYPE html>  
  2. <html>  
  3.   
  4. <head>  
  5.     <meta charset="utf-8" />  
  6.     <title>首页</title>  
  7.     <!--  
  8.             作者:iamlisen@163.com  
  9.             时间:2017-07-25  
  10.             描述:引入js  
  11.         -->  
  12.     <script src="js/jQuery/jquery-3.2.1.js" type="text/javascript"></script>  
  13.     <script src="js/bootstrap/bootstrap.js" type="text/javascript"></script>  
  14.     <script src="js/bootstrap-select/bootstrap-select.js" type="text/javascript"></script>  
  15.     <script src="js/bootstrap-select/defaults-zh_CN.js" type="text/javascript"></script>  
  16.     <!--  
  17.     作者:iamlisen@163.com  
  18.     时间:2017-07-25  
  19.     描述:引入css  
  20. -->  
  21.     <link href="css/bootstrap/bootstrap.css" rel="stylesheet" />  
  22.     <link href="css/bootstrap/bootstrap-theme.min.css" rel="stylesheet" />  
  23.     <link href="css/bootstrap-select/bootstrap-select.min.css" rel="stylesheet" />  
  24.     <!--  
  25.     作者:iamlisen@163.com  
  26.     时间:2017-07-25  
  27.     描述:自定义js  
  28. -->  
  29.     <script type="text/javascript">  
  30.         $(function() {  
  31.                 $("#btn1").click(function(event) {  
  32.                     /* Act on the event */  
  33.                 alert(null==undefined);//true  
  34.                 });  
  35.   
  36.                 $("#btn2").click(function(event) {  
  37.                     /* Act on the event */  
  38.                 alert(null===undefined);//false  
  39.                 });  
  40.   
  41.                 $("#btn3").click(function(event) {  
  42.                     /* Act on the event */  
  43.                 alert(typeof(null) == typeof(undefined));//false  
  44.                 alert(typeof(null));//object  
  45.                 alert(typeof(undefined));//undefined  
  46.                 });  
  47.         });  
  48.     </script>  
  49. </head>  
  50.   
  51. <body>  
  52.     <div class="panel-body">  
  53.         <button type="button" class="btn btn-success" id="btn1" style="margin-top:10px">使用==判断是否相等</button>  
  54.         <br/>  
  55.         <button type="button" class="btn btn-danger" id="btn2" style="margin-top:10px">使用===判断是否相等</button>  
  56.         <br/>  
  57.         <button type="button" class="btn btn-info" id="btn3" style="margin-top:10px">使用typeof判断</button>  
  58.     </div>  
  59. </body>  
  60.   
  61. </html>  
本文地址:https://www.lisen.me/undefined-and-null-places-prone-to-errors-in-javascript.html
版权声明:本文为原创文章,版权归 木子网 所有,欢迎分享本文,转载请保留出处!

发表评论


表情