广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >Javascript中Null和undefined的简单理解
  • 928
分享到

Javascript中Null和undefined的简单理解

2024-04-02 19:04:59 928人浏览 薄情痞子
摘要

目录前言undefinedNull附:实际应用总结前言 在 javascript 中有两种表达“无”的方式,那就是使用undefined和null。 unde

前言

javascript 中有两种表达“无”的方式,那就是使用undefined和null。

undefined

如果您创建一个变量并且不对其进行任何设置,它将是undefined. ?

let dog;
console.log(dog);

image-20220330223218079

undefined是已经创建(变量)但尚未定义(给定值)的东西。

对象的属性也是如此。

一个不具有任何属性的person对象。

let person={
}

如果在控制台中输入person.dog,它将返回undefined。

image-20220330223355043

为什么?因为person什么都没有。这就是undefined的。

当尝试访问已创建但未赋予值的变量时,就会出现这种情况。

如果在控制台中输入test,您会看到返回的错误消息说*“test is not defined”*,这意味着您没有创建名为test的变量.

image-20220330223452230

对于我们上面使用的狗示例,我们已经创建了变量,但我们没有设置值。这就是区别。

Null

现在我们将讨论null类型。

Null 是空值,而 undefined 是尚未设置值的变量。

我们将通过一些示例进行演示。

在控制台输入下面的代码。

let somethingUndefined;
const somethingNull = null;

注意:您不能在不设置值的情况下使用 const 变量。

somethingUndefined是未定义的,因为它没有设置值,而somethingNull具有 null 的值,它什么都没有。它们都什么都不是,只是方式不同。

例如,假设我们有 Cher 和 Teller(他们都是真人),我们将在这样的对象中表示他们 ?

const zhangsan = {  mane: "zhangsan",};
const lisi = {  name: "lisi",  age: 18,};
lisi.mane = "li";
lisi.age = null;

在此示例中,zhangsan没有age属性。

另一方面,我们又将lisi的age设置为null。

在控制台中,如果您键入,zhangsan.age您将看到返回的 undefined 值。当您尝试lisi.age时,将返回 null 的值。

image-20220330223916282

用一句话总结两者的区别就是:undefined 表示一个变量自然的、最原始的状态值,而 null 则表示一个变量被人为的设置为空对象,而不是原始状态。所以,在实际使用过程中,为了保证变量所代表的语义,不要对一个变量显式的赋值 undefined,当需要释放一个对象时,直接赋值为 null 即可。

附:实际应用

上面说了那么多,好像除了增加复杂性之外,并没有什么实际的用处。

下面用代码演示这两种类型的实际用法,可以体会不存在和空值具体有什么区别和用处:

var foo = {a:1, b:2};
console.log(JSON.stringify(foo)); // {"a":1,"b":2}
foo = {...foo, a:null};
console.log(jsON.stringify(foo)); // {"a":null,"b":2}
foo = {...foo, a:undefined};
console.log(JSON.stringify(foo)); // {"b":2}

从上面的代码可以看到,把一个对象的属性设置成undefined后,这个属性就消失了、不存在了。而设置成null,这个属性还是存在,只不过是null值。

如果你想让对象中某个属性消失,那么就把它设置成undefined吧。这也许是undefined和null同时存在的最大的意义。

总结

到此这篇关于Javascript中Null和undefined的文章就介绍到这了,更多相关JS Null和undefined内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: Javascript中Null和undefined的简单理解

本文链接: https://www.lsjlt.com/news/145120.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作