脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → js null和undefined

Javascript基础教程之比较null和undefined值

 更新时间：2016年05月16日 11:41:09   作者：Luka.Ye  
这篇文章主要介绍了Javascript基础教程之比较null和undefined值的相关知识，非常不错，具有参考借鉴价值，感兴趣的朋友一起学习吧

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

以上内容是小编给大家介绍的js基础教程之比较null和undefined值的相关知识，希望对大家有所帮助！

您可能感兴趣的文章:

相关文章

  • Layer UI表格列日期格式化及取消自动填充日期的实现方法

    Layer UI表格列日期格式化及取消自动填充日期的实现方法

    这篇文章主要介绍了Layer UI表格列日期格式化及取消自动填充日期的实现方法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2020-05-05
  • 基于js实现微信发送好友如何分享到朋友圈、微博

    基于js实现微信发送好友如何分享到朋友圈、微博

    微信浏览器内置了javascript私有对象WeixinJSBridge，可以实现发送给朋友、分享到朋友圈、分享到微博等功能，本篇文章给大家介绍基于js实现微信发送给朋友如何分享到朋友圈、微博，感兴趣的朋友一起学习吧
    2015-11-11
  • JS实现单个或多个文件批量下载的方法详解

    JS实现单个或多个文件批量下载的方法详解

    在前端Web开发中，下载文件是一个很常见的需求。这篇文章就来和大家介绍下几种download解决方案，以及特殊Case的最佳方案选择，希望对大家有所帮助
    2023-02-02
  • JavaScript实现经纬度转换成地址功能

    JavaScript实现经纬度转换成地址功能

    这篇文章主要介绍了JavaScript实现经纬度转换成地址,非常不错，具有参考借鉴价值，需要的朋友可以参考下
    2017-03-03
  • 封装一个公用Echarts图表组件的3种模板代码示例

    封装一个公用Echarts图表组件的3种模板代码示例

    这篇文章主要给大家介绍了关于封装一个公用Echarts图表组件的3种模板,定义图表公共样式是为了统一同一网站各页面图表的基础样式,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-02-02
  • 小程序实现列表删除功能

    小程序实现列表删除功能

    这篇文章主要为大家详细介绍了小程序实现列表删除功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-10-10
  • Electron实现右键保存图片到本地功能

    Electron实现右键保存图片到本地功能

    Electron是开发跨平台pc客户端的利器,最近在使用它时遇到一个需要右键保存页面中图片的功能,Electron虽使用了Chromium内核但却无法直接使用系统右键,需要自定义右键菜单,然后添加图片保存功能,以下是我的使用方法,需要的朋友可以参考下
    2024-07-07
  • JavaScript编码风格精选指南(编写可维护的代码规范)

    JavaScript编码风格精选指南(编写可维护的代码规范)

    javascript编码规范能够增强代码的简洁性、可读性、可扩展性,项目做到后期,每修改一次,所耗费的成本就越高,编码规范能节省这样的成本,并且能很好拓展升级原有系统功能,javascript编码规范也是开源社区大家约定俗成的规则！
    2024-06-06
  • js+SVG实现动态时钟效果

    js+SVG实现动态时钟效果

    这篇文章主要为大家详细介绍了js+SVG实现动态时钟效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-07-07
  • 微信小程序swiper-dot中的点如何改成滑块详解

    微信小程序swiper-dot中的点如何改成滑块详解

    swiper组件是滑块视图容器,这篇文章主要给大家介绍了关于微信小程序swiper-dot中的点如何改成滑块的相关资料,实现以后的效果还是不错的,需要的朋友可以参考下
    2021-07-07

最新评论