首页 > 其他分享 >JS中undefined和null的区别

JS中undefined和null的区别

时间:2023-03-10 19:32:00浏览次数:40  
标签:log undefined 数据类型 JS null 赋值

● JavaScript 真是一个特殊的语言, 其他语言都只有一个表示 "无" 的值, 比如 Java 语言用的是 null, C 语言用的是 NULL, Python 语言用的是 None, Ruby 语言用的是 nil. 只有 JS 里面表示 "空" 的有两个, 一个是 undefined, 一个是 null

● 很多小朋友在刚开始学习的时候, 都会有一个疑问, 就是 undefined 和 null 二者之间有什么区别呢 ? 我什么时候该用什么呢 ?

● 接下来, 咱们就来好好聊一聊

JS的基本数据类型

● 在 JS 内, 有几个基本数据类型

● ES5

○ Number 数值

○ String 字符串

○ Boolean 布尔

○ Undefined 空

○ Null 空

● ES6

○ Symbel 唯一值

● undefined 和 null 其实就是 JS 中的基本数据类型, 空类型

○ 从这个角度来看, 他们两个是一样的, 都表示 空 的意思

○ 并且在进行数据类型比较的时候, 某些情况下也是一样的

console.log(undefined == null) // true

两者的区别

● 两者的区别还是在于含义

● 之前我们说过, 所有的数据在计算机都是以二进制形式存储的

● 那么这两个数据也是会按照二进制形式存储的

○ undefined 因为表示的是 "没有", 所以没得转换, 啥也没有

○ null 因为表示的是 "空", 其实是有内容, 只不过有一个空内容, 存储的是 0000 0000 ...

● 那么反馈到我们的代码内

○ undefined 就是没有值, 或者说未被赋值

○ null 就是有值, 有一个空值, 一般会被当做这里有一个空对象, 也叫作空指针

● 举个例子 : 咱们以数字为例

JS中undefined和null的区别_数据类型

这就是有一个具体的数字, 100 200 什么的

JS中undefined和null的区别_数据类型_02

这就是 0, 用完了, 没有了

JS中undefined和null的区别_数据类型_03

这就是 null, 有一个空架子, 其他的什么都没有

JS中undefined和null的区别_赋值_04

这就是 undefined, 连个架子都没有

● 根据上面的例子

○ undefined, 你什么都不需要做, 只要什么也不赋值就是 undefined

○ null, 需要你赋值, 直接赋值为一个 null, 也就是你要安装一个空架子

两者对比

1. 数据类型不同, 但是值相同

○ 两个数据分别属于 Undefined 类型和 Null 类型

○ 但是表示的值都是空

○ 所以在比较的时候, 我们要注意

console.log(undefined == null) // true, 不涉及数据类型比较
console.log(undefined === null) // false, 涉及数据类型比较

2. 数据类型转换成为数值类型的时候结果不一样

○ null 表示空, 存储的时候也是一大堆 0, 所以转换为数值是 0

○ undefined 表示没有, 什么都没有内容转换为数值以后是 NaN

console.log(Number(null)) // 0
console.log(Number(undefined)) // NaN

3. 使用场景不同

● null

○ 在我们需要一个空值或者置空变量的时候手动赋值

○ 原型链的终点位置, 也就是 Object.prototype.__proto__ 是 null

● undefined

○ 在变量声明未赋值的时候就是 undefined

○ 函数只有形参没有实参的时候, 这个形参的值也是 undefined

○ 如果一个函数没有设置返回值, 那么这个函数的返回值也是 undefined

总结

● 总之, 我们就记住一个原则

○ 当你什么也没有做过的时候, 那么就是 undefined

○ 只有你想白干活的时候, 那么你就手动给他写成 null 就好了

标签:log,undefined,数据类型,JS,null,赋值
From: https://blog.51cto.com/u_14573321/6113488

相关文章

  • Java对象List<对象>转JSON的异常
    @Data@Accessors(fluent=true)publicclassA{privateStringid;privateList<B>b;}@Data@Accessors(fluent=true)publicclassB{privateS......
  • 【希尔排序ShellSort算法详解】Java/Go/Python/JS/C不同语言实现
    【希尔排序算法详解】Java/Go/Python/JS/C不同语言实现 说明希尔排序(ShellSort)是插入排序的一种改进版,也称递减增量排序算法(DiminishingIncrementSort),其实质是将数......
  • js装饰器作用
    JavaScript装饰器(Decorator)是一种语法特性,可以用于修改类和类的属性或方法。它是ES2017引入的新特性,在Vue3和Angular等现代框架中广泛使用。装饰器可以让我们在不......
  • Rxjs编程系列-基本概念
    Rxjs就是利用javascript实现了响应式编程的概念,利用监听流的模式处理异步操作。1.函数响应式编程函数式编程声明式纯函数数据不可变性响应式编程通过可监听流......
  • Rxjs编程系列-操作符
    定义:一个操作符是返回一个Observable对象的函数,不过,有的操作符是根据其他Observable对象产生返回的Observable对象,有的操作符则是利用其他类型输入产生返回的Observable......
  • Vue在js中的使用思考,非脚手架
    varvm=newVue({el:".container",//挂载点data:{},//数据决定了页面的样子|数据的响应式=>数据变了界面跟着变computed:{},//计算属性,惰性求值的......
  • 在JSP页面对一组数据进行判断之后输出
    需求:在合同信息管理页面做一个临期提醒功能,即在终止日期前一个月将该条记录显示在别处以提醒工作人员。实现思路:我在建表时多加了一项bool型数据,用来标记这项数据是否在一......
  • 从three.js 开始
    02本地运行本地运行加https不能直接localhost1本地2parceljs(类似webpack等)新建文件夹npminitnpminstallparcel-bundler普通依赖--save-dev是设置为开......
  • java String转Json工具类
    importcom.fasterxml.jackson.core.JsonProcessingException;importcom.fasterxml.jackson.databind.ObjectMapper;importjava.util.HashMap;importjava.util.List;imp......
  • JS实现继承的几种方式
    前言JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一。那么如何在JS中实现继承呢?让我们拭目以待。预备知识1、构造函数的属性funcionA(name){this.name......