js中==和===的区别以及总结

学习js时我们会遇到 == 和 === 两种符号,现做总结如下

两种符号的定义

  "==" 叫做相等运算符

  "===" 叫做严格相等运算符(全等运算符)

它们之间的区别

  "==" 只判断等号两边的值是否相等,而不判断类型是否相同。值相同则返回 true

  "===" 既要判断值是否相等,也要判断类型是否相同,即全等才能返回 true

总结:

(分析 ==)

先把等号两侧的值转化为基本数据类型,如果两侧的值基本数据类型不同,转化为数字再进行比较,如果相同,直接比较

1、undefined 和 null 互相比较返回 true,和自身比较也返回 true,其他情况返回 false

2、Infinity 只和自身比较返回 true

3、NaN,{} 和任意值比较都是返回 false

4、如果其中一个值是 true,则将其转换为 1 再进行比较。如果其中一个值是 false,则将其转换为 0 再进行比较

5、要比较相等性之前,不能将 null 和 undefined 转换成其他任何值

6、 如果一个值是数字,另一个是字符串,先将字符串转换为数值,然后使用转换后的值进行比较

7、如果等号两侧都是对象,则比较它们是否为同一个对象。如果指向同一个对象,则返回 true,否则返回 false

较为复杂的情况:

8、如果等号一侧是Number,String,Boolean这三种类型中的一种,而另一侧是对象类型时, 则对对象执行ToPrimitive操作(这步是JS解释器执行的,ToPrimitive方法的实现,正是依次去调用对象的valueOf,toString方法,直到其中一个方法返回一个基本值,然后比较返回的基本值和另一侧那三中类型的值。如果这两个方法没有返回基本值 ,那就认定不相等 )

(分析 ===)

1、先分析是否为相同类型,如果类型不同直接返回 false,

  如果类型相同,

    基本类型,直接比较值是否相同,

    对象类型,由于对象类型保存的是对象(包括数组,函数)的地址值,所以地址值不同的,返回的都是 false。地址值相同,返回 true

上面说的有些抽象,下面我们来结合具体的实例来分析一下

== 详解(有隐式转换)    

一、等号两侧是基本数据类型,且类型不同时

1. 字符串与数字比较 (等号两侧转化为数字,再比较)

  100 == "100"  ==>  100 == 100  // true

  100 == "99"  ==>  100 == 99  // false

  100 == "abc"  ==>  100 == NaN  // false

  1 == "abc"  ==>  1 == NaN  // false

  1 == ""  ==>  1 == 0  // false

2.字符串与布尔值比较(等号两侧转换为数字,再比较)

  "abc" == true  ==>  NaN == 1  // false

  "abc" == false  ==>  NaN == 0  // false

  "" == true  ==>  0 == 1  // false

  "" == false  ==>  0 == 0  // true

3.数字与布尔值比较(等号两侧转换为数字,再比较)

  1 == true  ==>  1 == 1  // true

  0 == true  ==>  0 == 1  // false

  100 == true  ==>  100 == 1  // false

  1 == false  ==>  1 == 0  // false

  0 == false  ==>  0 == 0  // true

  100 == false  ==>  100 == 0  // false

4. undefined 和 null

  undefined 与 null 比较特殊    要比较相等性之前,不能将 null 和 undefined 转换成其他任何值

  undefined 和 null 互相比较返回 true,和自身比较也返回 true,其他情况返回 false

  undefiend == undefined  // true

  undefined == null  // true

  null == null  // true

  undefined == 其他值  // false

  null == 其他值  // false

5. NaN

  NaN(非数值)也很特殊,NaN 和任何值(包括自己)比较都是返回 false

  NaN == NaN  // false

  NaN == 其他值  // false

二、等号两侧有复杂数据类型(引用类型)时,且类型不同时

  (特殊:{} 和任何值比较返回都是false )

1.等号两侧都为引用类型时

  (由于引用类型保存的是对象(包括数组,函数)的地址值,所以地址值不同的,返回的都是 false)

等号两侧为相同的引用数据类型时 

  实例

  [1,2] == [1,2]  // false

  [1,2] == [2,3]  // false

  {x:1} == {x:1}  // false

  {x:1} == {y:1}  // false

等号两侧为不同的引用数据类型时

  实例

  [1,2] == {y:1}  // false

  

2.有且只有一侧为引用数据类型时

  实例

  [1,2] == 1  ==>  NaN == 1  // false

  [1,2] == true  ==>  NaN == 1  // false

  [ 1 ] == 1  ==>  1 == 1  // true

  [1] == '1'  ==>  '1' == '1'  // true

  

  [] == 0  ==>  0 == 0  // true

  [] == '0'  ==>  '' == '0'  // false

  [] == ''  ==>  '' == ''  // true

  {x:1} == 1  ==>  NaN == 1  // false

  {x:1} == '1'  ==>  NaN == 1  // false

  true == {x:1}  ==>  1 == NaN  // false

=== 详解(无隐式转换)

  实例

  100 == "100"  // false

  100 == 100  // true

  "100" == "100"  // true

  {x:1} == {y:1}  // false

  

js中==和===的区别以及总结的更多相关文章

  1. js中==, !==, === ,!=的区别

    在讨论比较符的时候我们先要来讨论哈js的类型,这样有助于我们从本质上了解原理. 下面是我找的资料加上个人的总结: js中有5种数据类型:Undefined.Null.Boolean.Number和St ...

  2. js 中null,undefined区别

    首先摘自阮一峰先生的文章: 大多数计算机语言,有且仅有一个表示"无"的值,比如,C语言的NULL,Java语言的null,Python语言的None,Ruby语言的nil. 有点奇 ...

  3. js 中 == 和 === 的区别

    js中的 ==和===的区别 简单理解 js 是弱类型的语言,其中 == 可以理解为 是值是否相等,而===不仅比较值是否相等,还比较类型是否相等. 简单案例: var str = "1&q ...

  4. js中!和!!的区别及用法

    js中!的用法是比较灵活的,它除了做逻辑运算常常会用!做类型判断,可以用!与上对象来求得一个布尔值,1.!可将变量转换成boolean类型,null.undefined和空字符串取反都为false,其 ...

  5. jq中$(function(){})和js中window.onload区别

    先看下执行代码: $(function(){   console.log("jq");}) $(function(){   console.log("jq1") ...

  6. 在js中==和===的区别

    “==”:叫相等运算符 “===”:叫严格运算符 它们两有什么区别呢? == :表示值相等则都为true ===:表示 不仅要值相等,双方类型也要相等才为true 例子如下: js代码如下: // “ ...

  7. js中“==”与"==="的区别

    首先,== equality 等同,=== identity 恒等. ==, 两边值类型不同的时候,要先进行类型转换,再比较. ===,不做类型转换,类型不同的一定不等. 一言以蔽之:==先转换类型再 ...

  8. Js 中 == 与 === 的区别

    1.对于string,number等基础类型,==和===是有区别的 1)不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等,===如果类型不同,其结果就是不等 2)同类型比较,直接进 ...

  9. js中[]、{}、()区别

    一.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数体 {}表示对象.[]表示对象的属性.方法,()如果用在方法名后面,代表调用 如:var LangShen = {&quo ...

随机推荐

  1. 从五大结构体,带你掌握鸿蒙轻内核动态内存Dynamic Memory

    摘要:本文带领大家一起剖析了鸿蒙轻内核的动态内存模块的源代码,包含动态内存的结构体.动态内存池初始化.动态内存申请.释放等. 本文分享自华为云社区<鸿蒙轻内核M核源码分析系列九 动态内存Dyna ...

  2. Electron-Vite2-MacUI桌面管理框架|electron13+vue3.x仿mac桌面UI

    基于vue3.0.11+electron13仿制macOS桌面UI管理系统ElectronVue3MacUI. 前段时间有分享一个vue3结合electron12开发后台管理系统项目.今天要分享的是最 ...

  3. 再试Hibernate框架

    几个月前因为学习需要第一次接触了Hibernate(之前一直在用MyBatis),后来觉得有点难,也急着找工作,所以就没继续学下去了.但是找工作的时候发现Hibernate的需求更高,使用率更高,所以 ...

  4. PyCharm 2020.1 激活教程

    本文内容皆为作者原创,如需转载,请注明出处:https://www.cnblogs.com/xuexianqi/p/14967434.html 免责声明:本方法只做学习研究之用,不得用于商业用途 若经 ...

  5. layui--入门(helloWorld)

    具体可参考官方文档:https://www.layui.com/doc/ 由于引入layui 需要用到node.js 安装过程可参考: https://www.cnblogs.com/liuchenx ...

  6. 浅读tomcat架构设计之Pipeline-Valve管道(4)

    tomcat Container容器处理请求是使用Pipeline-Valve管道来处理的,后续写的tomcat内存马,和他紧密结合 Pipeline-Valve是责任链模式,责任链模式是指在一个请求 ...

  7. jenkins pipeline构建后返回构建结果给gitlab

    jenkins pipeline构建后返回构建结果给gitlab 使用场景 gitlab 合并请求时要求管道任务必须成功,否则无法执行合并操作,又不想使用gitlab ci 工具. 实现方法 1.Ge ...

  8. AcWing 1277. 维护序列

    #include <bits/stdc++.h> #define ll long long #define N 4000010 using namespace std; ll t[N],a ...

  9. 面试题二:JVM

    JVM垃圾回收的时候如何确定垃圾? 有2种方式: 引用计数 每个对象都有一个引用计数属性,新增一个引用时计数加1,引用释放时计数减1,计数为0时可以回收: 缺点:无法解决对象循环引用的问题: 可达性分 ...

  10. Quartz:Quartz定时代码实现

    1.添加pom.xml <dependency> <groupId>org.quartz-scheduler</groupId> <artifactId> ...