首页 > 其他分享 >JS 特殊数据类型的 == 和 === 比较

JS 特殊数据类型的 == 和 === 比较

时间：2023-06-26 20:02:04浏览次数：42  
标签：特殊 console log NaN 数据类型 Number JS null undefined


在javascript的世界里，无论是函数，还是数组，还是对象，亦或是字符串，数字，布尔类型，在这些数据类型中，总有这么几个特立独行，然后造成一些可有可无的讨厌bug。
而这些讨厌bug出现的原因就是由于比较时产生的错误，而且最不易查出错误。
在这里我们整理了这几个特殊数据类型的比较。直接上代码。
上代码前，普及一个知识：
==内容比较，数据类型不比较。
===内容比较，数据类型也比较。

 

==比较：

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
// "" null undefined NaN 0
console.log("\"\"==\"\":");
console.log(""=="");  //false
console.log("\"\"==null:");
console.log(""==null);//false
console.log("\"\"==undefined:");
console.log(""==undefined);//false
console.log("\"\"==NaN:");
console.log(""==NaN);//false
console.log("\"\"==Number.NaN:");
console.log(""==Number.NaN);//false
console.log("\"\"==0:");
console.log(" "==0);//true

console.log("null==\"\":");
console.log(null=="");
console.log("null==null:");
console.log(null==null);
console.log("null==undefined:");
console.log(null==undefined);
console.log("null==NaN:");
console.log(null==NaN);
console.log("null==Number.NaN:");
console.log(null==Number.NaN);
console.log("null==0:");
console.log(null==0);

console.log("undefined==\"\":");
console.log(undefined=="");
console.log("undefined==null:");
console.log(undefined==null);
console.log("undefined==undefined:");
console.log(undefined==undefined);
console.log("undefined==NaN:");
console.log(undefined==NaN);
console.log("undefined==Number.NaN:");
console.log(undefined==Number.NaN);
console.log("undefined==0:");
console.log(undefined==0);

console.log("NaN==\"\":");
console.log(NaN=="");
console.log("NaN==null:");
console.log(NaN==null);
console.log("NaN==undefined:");
console.log(NaN==undefined);
console.log("NaN==NaN:");
console.log(NaN==NaN);
console.log("NaN==Number.NaN:");
console.log(NaN==Number.NaN);
console.log("NaN==0:");
console.log(NaN==0);

console.log("0==\"\":");
console.log(0=="");
console.log("0==null:");
console.log(0==null);
console.log("0==undefined:");
console.log(0==undefined);
console.log("0==NaN:");
console.log(0==NaN)
console.log("0==Number.NaN:");
console.log(0==Number.NaN);
console.log("0==0:");
console.log(0==0);
</script>

 

效果图：

JS 特殊数据类型的 == 和 === 比较_html


JS 特殊数据类型的 == 和 === 比较_字符串_02


 

===比较：

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
// ==内容比较，数据类型不比较。
// ===内容比较，数据类型也比较。
// "" null undefined NaN 0
console.log("\"\"===\"\":");
console.log(""==="");  //false
console.log("\"\"===null:");
console.log(""===null);//false
console.log("\"\"===undefined:");
console.log(""===undefined);//false
console.log("\"\"===NaN:");
console.log(""===NaN);//false
console.log("\"\"===Number.NaN:");
console.log(""===Number.NaN);//false
console.log("\"\"===0:");
console.log(" "===0);//true

console.log("null===\"\":");
console.log(null==="");
console.log("null===null:");
console.log(null===null);
console.log("null===undefined:");
console.log(null===undefined);
console.log("null===NaN:");
console.log(null===NaN);
console.log("null===Number.NaN:");
console.log(null===Number.NaN);
console.log("null===0:");
console.log(null===0);

console.log("undefined===\"\":");
console.log(undefined==="");
console.log("undefined===null:");
console.log(undefined===null);
console.log("undefined===undefined:");
console.log(undefined===undefined);
console.log("undefined===NaN:");
console.log(undefined===NaN);
console.log("undefined===Number.NaN:");
console.log(undefined===Number.NaN);
console.log("undefined===0:");
console.log(undefined===0);

console.log("NaN===\"\":");
console.log(NaN==="");
console.log("NaN===null:");
console.log(NaN===null);
console.log("NaN===undefined:");
console.log(NaN===undefined);
console.log("NaN===NaN:");
console.log(NaN===NaN);
console.log("NaN===Number.NaN:");
console.log(NaN===Number.NaN);
console.log("NaN===0:");
console.log(NaN===0);

console.log("0===\"\":");
console.log(0==="");
console.log("0===null:");
console.log(0===null);
console.log("0===undefined:");
console.log(0===undefined);
console.log("0===NaN:");
console.log(0===NaN)
console.log("0===Number.NaN:");
console.log(0===Number.NaN);
console.log("0===0:");
console.log(0===0);
</script>

 

效果图：

JS 特殊数据类型的 == 和 === 比较_javascript_03


JS 特殊数据类型的 == 和 === 比较_javascript_04


  

typeof()和isNaN()：

<!DOCTYPE html>
<meta charset="UTF-8">
<script>
console.log(typeof "");
console.log(typeof null);
console.log(typeof undefined);
console.log(typeof NaN);
console.log(typeof 0);
// "" null undefined NaN 0
console.log("isNaN(\"\")");
console.log(isNaN(""));
console.log("isNaN(null)");
console.log(isNaN(null));
console.log("isNaN(undefined)");
console.log(isNaN(undefined));
console.log("isNaN(NaN)");
console.log(isNaN(NaN));
console.log("isNaN(0)");
console.log(isNaN(0));
</script>

 

效果图：

JS 特殊数据类型的 == 和 === 比较_javascript_05


 

结论：
双等于　　0==""为true ，  null==undefined为true  其他除了NaN之外等于自己都是true，剩下来的都是false
三等于      除了NaN之外等于自己都是true，剩下来的都是false

""是string类型
null是Object类型
undefined是undefined类型
0和NaN都是number类型

 

 

 

 

 

标签：特殊,console,log,NaN,数据类型,Number,JS,null,undefined
From： https://blog.51cto.com/u_16171388/6557288

相关文章

  • JS for...in 遍历语句
    for...in语句用于对数组或者对象的属性进行循环操作。for(变量in对象){   在此执行代码}这里的“变量”用来指定变量，指定的变量可以是数组元素，也可以是对象的属性。 举个例子：<!DOCTYPEhtml><metacharset="UTF-8"><script>varx;varzoon=newArray();zoon[0]="......
  • JS canvas 标签制作色相球
    <!DOCTYPEhtml><html><head><metacharset="UTF-8"/><title>JScanvas标签制作色相球</title></head><body><canvas></canvas><scripttype="text/javascript">varcanvas,ctx,ma......
  • NodeJS系列（4）- ECMAScript 6 (ES6) 语法（二）
    在“NodeJS系列（3）-ECMAScript6(ES6)语法（一）”里，我们介绍并演示let、const、Symbol等ES6语法和概念。本文在“NodeJS系列（2）-NPM项目Import/ExportES6模块”的npmdemo 项目的基础上，继续介绍并演示函数扩展、类等ES6语法和概念。NodeJSES6：https://nodejs.org......
  • 聊一聊 Lua 的基础数据类型：数值、布尔、字符串
    楔子任何一门语言都提供了不同类型的数据结构，那么Lua中都有哪些数据结构呢？nil：空boolean：布尔类型，分别是true和falsenumber：数值类型，整型和浮点型都属于numberstring：字符串table：表function：函数userdata：用户数据thread：线程Lua总共提供了以上8种数据类型，目前只需要......
  • 【js学习笔记八】如何写一个简单的前端回调函数
     目录前言导语代码部分 运行结果总结前言我是歌谣我有个兄弟巅峰的时候排名c站总榜19叫前端小歌谣曾经我花了三年的时间创作了他现在我要用五年的时间超越他今天又是接近兄弟的一天人生难免坎坷大不了从头再来歌谣的意志是永恒的放弃很容易但是坚持一定很酷导语书写一......
  • 【js学习笔记九】前端异步请求逐步进行一回调
     目录前言导语前言运行结果解决方案运行结果前言我是歌谣我有个兄弟巅峰的时候排名c站总榜19叫前端小歌谣曾经我花了三年的时间创作了他现在我要用五年的时间超越他今天又是接近兄弟的一天人生难免坎坷大不了从头再来歌谣的意志是永恒的放弃很容易但是坚持一定很酷导语......
  • Selenium基础：特殊Dom结构操作 07
    特殊Dom结构是指对元素不能直接操作，需要进行特殊定位切换到它所在的Dom结构，然后才能对其元素进行操作1、windows弹窗--alertconfirmprompt使用driver.switch_to.alert方法alert类操作方法：accept()：确定dismiss()：取消text()：获取弹出框内的内容send_keys(keysToSend)：输入......
  • jsp http大文件断点续传上传
    ​ javaweb上传文件上传文件的jsp中的部分上传文件同样可以使用form表单向后端发请求，也可以使用ajax向后端发请求    1.通过form表单向后端发送请求         <formid="postForm"action="${pageContext.request.contextPath}/UploadServlet"method="post"e......
  • elk 入门 - 分析nginx日志 + json格式 + 有调试的意识 + elk7.2.0
    1.本次采用的一台主机，将所有的软件安装一台上进行测试工作。2.安装部署：https://blog.51cto.com/hwg1227/22999953.简单调试输出rubydebuginput{file{path=>"/usr/local/log_test/*/*/*.log"start_position=>"beginning"}}output{e......
  • NodeJS本地环境安装及设置
    背景作为一个后端，服务接口自然不在话下。分分钟给安装上百个接口。但是交互。。。postman,postman,,,,,可视化和交互上那简直真的就是都长这样：想搞个React前端页面。先使用一下单表的增删改查操作。用来操作数据库玩玩一、概念1、Node.js是什么？Node.js是一个开源和跨......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99