脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → 基础知识 → js null undefined

Javascript基础_简单比较undefined和null 值

 更新时间：2016年06月14日 11:58:54   投稿：jingxian  
下面小编就为大家带来一篇Javascript基础_简单比较undefined和null 值。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧

JavaScript 中有两个特数值： undefined和null，在比较它们的时候需要留心。在读取未赋值的变量或试图读取对象没有的属性时得到的就是 undefined 值。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
  var myData = {
    name:"Luka",
    weather:"sunny"
  };
  document.writeln("Prop: "+myData.doesntexits);
</script>
</body>
</html>

输出结果：

Prop: undefined

Javascript 又定义了一个特殊值 null ，这个值与 undefined 略有不同。后者是在未定义值得情况下得到的值，而前者则用于表示已经赋了一个值但该值不是一个有效的 object、string、number 或 boolean 值（也就是说所定义的是一个无值[no value]）。

下面代码先后使用 undefined 和 null 以展示其不同效果：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
  var myData = {
    name:"Luka"
  };
  //读取 weather 属性
  document.writeln("Var: "+myData.weather+"<br />");
  //判断对象是否具有 weather 这个属性
  document.writeln("Prop: "+("weather" in myData)+"<br /><br />");

  myData.weather = "sunny";
  document.writeln("Var: "+myData.weather+"<br />");
  document.writeln("Prop: "+("weather" in myData)+"<br /><br />");

  myData.weather = null;
  document.writeln("Var: "+myData.weather+"<br />");
  document.writeln("Prop: "+("weather" in myData)+"<br /><br />");
</script>
</body>
</html>

输出结果：

Var: undefined
Prop: false

Var: sunny
Prop: true

Var: null
Prop: true

1. 检查变量或属性是否为undefined 或 null

如果想检查某属性是否为 null 或 undefined(不管是哪一个)，那么只要使用 if 语句和逻辑非运算符(!)即可。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
  var myData = {
    name:"Luka",
    city:null
  };

  if(!myData.name){
    document.writeln("name is null or undefined <br /><br />");
  }else {
    document.writeln("name is not null or undefined <br /><br />")
  }

  if(!myData.city){
    document.writeln("city is null or undefined <br /><br />");
  }else {
    document.writeln("city is not null or undefined <br /><br />")
  }

  if(!myData.weather){
    document.writeln("weather is null or undefined <br /><br />");
  }else {
    document.writeln("weather is not null or undefined <br /><br />")
  }

</script>
</body>
</html>

输出结果：

name is not null or undefined

city is null or undefined

weather is null or undefined

2. 区分 null 和 undefined

在比较两个值时，所用办法应视需要而定。如果想同等对待 undefined值和null值，那么应该使用相等运算符(==)，让 Javascript 进行类型转换。此时值为 undefined 的变量会被认为与值为 null 的变量相等。如果要区分 null 和 undefined，则应使用等同运算符(===)。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
  var firstVal = null;
  var secondVal;

  var equality = firstVal == secondVal;
  var identity = firstVal === secondVal;

  document.writeln("Equality: "+equality+" <br />");
  document.writeln("Identity: "+identity+" <br />");
</script>
</body>
</html>

输出结果：

Equality: true
Identity: false

以上这篇Javascript基础_简单比较undefined和null 值就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • JS跨域问题详解

    JS跨域问题详解

    本文结合实际，分两种情况讨论跨域技术：首先讨论不同子域的跨域技术，然后讨论完全不同域的跨域技术。有需要的小伙伴可要看仔细了。
    2014-11-11
  • TypeScript中的函数和类你了解吗

    TypeScript中的函数和类你了解吗

    这篇文章主要为大家详细介绍了TypeScript中的函数和类，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助
    2022-03-03
  • 有关JavaScript中call()和apply() 的一些理解

    有关JavaScript中call()和apply() 的一些理解

    下面小编就为大家带来一篇有关JavaScript中call()和apply() 的一些理解。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • JavaScript reduce的基本用法详解

    JavaScript reduce的基本用法详解

    这篇文章主要为大家详细介绍了JavaScript reduce的基本用法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助
    2022-02-02
  • javascript数组详解

    javascript数组详解

    数组对象用来在单独的变量名中存储一系列的值。我们使用关键词 new 来创建数组对象。有两种向数组赋值的方法，也可以使用一个整数自变量来控制数组的容量
    2014-10-10
  • 关于uni-app页面Page和组件Component生命周期执行的先后顺序

    关于uni-app页面Page和组件Component生命周期执行的先后顺序

    这篇文章主要介绍了关于uni-app页面Page和组件Component生命周期执行的先后顺序,文中提供了具体的代码,还不清楚的朋友可以来学习一下
    2023-04-04
  • javascript打开word文档的方法

    javascript打开word文档的方法

    这篇文章主要介绍了javascript打开word文档的方法,需要的朋友可以参考下
    2014-04-04
  • JS中for循序中延迟加载动态效果的具体实现

    JS中for循序中延迟加载动态效果的具体实现

    今天在做一个前端的效果的时候碰到一个棘手的问题，就是实现一个动态的圆柱效果，废话不多少，直接上代码
    2013-08-08
  • 前端 el-table 本地搜索的实现代码

    前端 el-table 本地搜索的实现代码

    这篇文章主要介绍了前端 el-table 本地搜索的实现代码，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2021-08-08
  • 在Javascript中处理字符串之big()方法的使用

    在Javascript中处理字符串之big()方法的使用

    这篇文章主要介绍了在Javascipt中处理字符串之big()方法的使用,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-06-06

最新评论