首发地址

相信刚接触JS的人都会被他的想等性判断给整糊涂,看看下面代码,你能答对几个?

NaN === NaN // false
NaN == NaN // false
Object.is(NaN, NaN) // true
0 == false // true
1 == true // true
Number(null) === 0 // true
null == 0 // false

Javascript提供了三种不同的值比较操作,分别是严格相等、宽松相等、以及Object.is,今天查完资料后做了一下总结,希望下面的内容能够对大家有所帮助,如果哪些地方有误的话,也欢迎大家指正。

1. 严格相等 x === y判断逻辑

  1. 如果x的数据类型和y的数据类型不相同,返回false;
  2. 如果x是Number类型
    • x是NaN,返回false
    • y是NaN,返回false
    • x的值和y的值相等,返回true
    • x是+0,y是-0,返回true
    • x是-0,y是+0,返回true
    • 否则返回false
  3. 其他类型参照SameValueNonNumber(x, y)
    • 断言:x,y不是Number类型;
    • 断言: x,y的数据类型相同;
    • x是undefined, y是undefined return true;
    • x是null, y是null,return true;
    • x是字符串类型,当且仅当x,y字符序列完全相同时(长度相同,每个位置上的字符也相同)返回true, 否则返回false;
    • 如果x是布尔类型,当x,y都为true或者都为false时返回true,否则返回false;
    • 如果x是symbol类型,当x,y是相同的symbol值,返回true,否则返回false;
    • 如果x,y是同一个对象值,返回true,否则返回false;
NaN === NaN // false
undefined === undefined // true
null === null // true
undefined === null // false

2. 宽松相等 x == y

  1. 如果x,y的类型相同,返回x===y的结果;
  2. 如果x是null, y是undefined, 返回true;
  3. 如果x是undefined, y是null, 返回true;
  4. 如果x是数值,y是字符串, 返回x == ToNumber(y);
  5. 如果x是字符串,y是数值, 返回ToNumber(x) == y;
  6. 如果x是布尔类型, 返回ToNumber(x)==y 的结果;
  7. 如果y是布尔类型,返回 x==ToNumber(y) 的结果;
  8. 如果x是String或Number或Symbol中的一种并且Type(y)是Object,返回 x==ToPrimitive(y) 的结果
  9. 如果Type(x)是Object并且Type(y)是String或Number或Symbol中的一种,返回 ToPrimitive(x)==y 的结果
  10. 其他返回false
12 == '0xc' // true, 0xc是16进制
12 == '12' // true
12 == '12c' // false, 说明ToNumber转换是用的Number()方法

注意

Number(null) === 0
但是
null == 0 // false,

2.1 ToNumber将一个值转换为数值类型

详情参考数值类型转换

  1. 如果是boolean类型, true返回1,false返回0;
  2. 如果是数值,只是简单的传入返回;
  3. 如果是null,返回0
  4. 如果是undefined, 返回NaN;
  5. 如果是字符串,字符串如果只包含数字,则将其转换成十进制数;如果是有效的浮点格式,将其转换成对应的浮点数值;如果是二进制或十六进制将其转换成对应的十进制数值;
  6. 如果是对象,调用对象的valueOf()方法,然后依照前面规则转换,如果valueOf返回值是NaN,则调用toString()方法,再依照前面的规则转换返回的字符串

2.2 ToPrimitive

toPrimitive(A)通过尝试调用 A 的A.toString() 和 A.valueOf() 方法,将参数 A 转换为原始值(Primitive);

JS中原始类型有:Number、String、Boolean、Null、Undefined;

不同类型对象的valueOf()方法的返回值:

对象 返回值
Array 返回数组对象本身。
Boolean 布尔值
Date 存储的时间是从 1970 年 1 月 1 日午夜开始计的毫秒数 UTC
Function 函数本身
Number 数字值
Object 对象本身。这是默认情况, 可以覆盖自定义对象的valueOf方法
String 字符串值
// Array:返回数组对象本身
var array = ["ABC", true, 12, -5];
console.log(array.valueOf() === array); // true // Date:当前时间距1970年1月1日午夜的毫秒数
var date = new Date(2013, 7, 18, 23, 11, 59, 230);
console.log(date.valueOf()); // 1376838719230 // Number:返回数字值
var num = 15.26540;
console.log(num.valueOf()); // 15.2654 // 布尔:返回布尔值true或false
var bool = true;
console.log(bool.valueOf() === bool); // true // new一个Boolean对象
var newBool = new Boolean(true);
// valueOf()返回的是true,两者的值相等
console.log(newBool.valueOf() == newBool); // true
// 但是不全等,两者类型不相等,前者是boolean类型,后者是object类型
console.log(newBool.valueOf() === newBool); // false // Function:返回函数本身
function foo(){}
console.log( foo.valueOf() === foo ); // true
var foo2 = new Function("x", "y", "return x + y;");
console.log( foo2.valueOf() );
/*
ƒ anonymous(x,y
) {
return x + y;
}
*/ // Object:返回对象本身
var obj = {name: "张三", age: 18};
console.log( obj.valueOf() === obj ); // true // String:返回字符串值
var str = "http://www.xyz.com";
console.log( str.valueOf() === str ); // true // new一个字符串对象
var str2 = new String("http://www.xyz.com");
// 两者的值相等,但不全等,因为类型不同,前者为string类型,后者为object类型
console.log( str2.valueOf() === str2 ); // false

3.同值相等

同值相等由 Object.is 方法判断:

  • 两个值都是 undefined
  • 两个值都是 null
  • 两个值都是 true 或者都是 false
  • 两个值是由相同个数的字符按照相同的顺序组成的字符串
  • 两个值指向同一个对象
  • 两个值都是数字并且
    • 都是正零 +0,
    • 或者都是负零 -0,
    • 或者都是 NaN
    • 都是除零和 NaN 外的其它同一个数字
Object.is('foo', 'foo');     // true
Object.is(window, window); // true Object.is('foo', 'bar'); // false
Object.is([], []); // false var foo = { a: 1 };
var bar = { a: 1 };
Object.is(foo, foo); // true
Object.is(foo, bar); // false Object.is(null, null); // true Object.is(true, 'true') // false // 特例
Object.is(0, -0); // false
Object.is(0, +0); // true
Object.is(-0, -0); // true
Object.is(NaN, 0/0); // true

4.零值相等

与同值相等类似,不过会认为 +0 与 -0 相等。

小结

  • === 不做类型转换,当两边的数类型不相同时,直接返回false;当前类型相同且都是数值类型的时候,有一个是NaN,那么结果就是false, 另外 +0 === -0
  • ==运算符,当两边操作数类不相同时会做隐式转换,然后才进行比较,这样的话就会出现 false == 0, '' == false 等现象, 但是Object.is不会做这种转换

JS中的相等性判断===, ==, Object.is()的更多相关文章

  1. js中的数据类型和判断数据类型

    js中的数据类型和判断数据类型 基本数据类型,六大基本数据类型:字符串(String).数字(Number).布尔(Boolean).对象(Object).空(Null).未定义(Undefined) ...

  2. js中的new操作符与Object.create()的作用与区别

    js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...

  3. JS 中对变量类型判断的几种方式

    文章整理搬运,出处不详,如有侵犯,请联系~   数据类型判断和数据类型转换代码工具 在 JS 中,有 5 种基本数据类型和 1 种复杂数据类型,基本数据类型有:Undefined, Null, Boo ...

  4. js中的window.open返回object的错误

    系统中用javascript中的window.open后,页面返回了一个[object].因为系统的原因,必需使用href="javascript:window.open()"这样 ...

  5. 关于js中的this之判断this

    this绑定规则的优先级顺序 new操作符绑定 > 显示绑定 > 隐式绑定 > 默认绑定   所以在判断函数在某个调用位置应用的是哪条规则,可以按下列这样的顺序   if(函数在ne ...

  6. js中的数据类型及判断方法

    ECMAScirpt 变量有两种不同的数据类型:基本类型,引用类型. 基本类型 ● Boolean ● Null ● Undefined ● Number ● String ● Symbol (ECM ...

  7. JS中的数据类型及判断数据类型的方法

    简单类型(基本类型): number,string,boolean,null,undefined 复杂类型(引用类型):object typeof 只能判断基本数据类型 instanceof 能够判断 ...

  8. js中typeof可以准确判断哪些变量类型

    typeof 运算符返回一个用来表示表达式的数据类型的字符串.  可能的字符串有:"number"."string"."boolean".& ...

  9. JavaScript 中的相等性判断

    摘自:MDN https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Equality_comparisons_and_sameness: Ja ...

随机推荐

  1. SEER区块浏览器开发指南

    区块浏览器基本功能 区块链浏览器是浏览区块链信息的主要窗口,每一个区块所记载的内容都可以从区块链浏览器上进行查阅.用户可以使用区块链浏览器查询记录在区块中的交易信息,包括转账.预测.账户管理和社区治理 ...

  2. Be a Winner 当成功者

    Winners see opportunities. Losers see. Winners see possibilities. Losers see problems. Winners see t ...

  3. 走进JavaWeb技术世界1:JavaWeb的由来和基础知识

    本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 https://github.com/h2pl/Java-Tutorial 喜欢的话麻烦点下 ...

  4. Flask的请求扩展

    from flask import Flask,request app = Flask(__name__) 一.请求前 before_request 用法 @app.before_request de ...

  5. python selenium之Xpath定位

    属性描述 XPath 语法支持节点描述,节点描述为一个逻辑真假表达式,任何真假判断表达式都可在节点后方括号里表示,这条件必须在XPath处理这个节点前先被满足.在某一步骤可有多少个描述并没有限制. 对 ...

  6. RegExp实现字符替换

    将字符串组中的所有Paul替换成Ringo,g:执行全局匹配,查找所有匹配而非在找到第一个匹配后停止;\b:匹配单词边界,划分匹配字符的起始范围 <!DOCTYPE html> <h ...

  7. jQuery v1.10.2如何判断checkbox(复选框)是否被选中

    做项目时,我们经常会用到jquery来做一些判断,今天自己遇上判断复选框是否选中,然后搜索查看,发现现在网上的都是错误的,下面罗列错误的: 1.$("#id").attr(&quo ...

  8. Windows系统调用中API的3环部分(依据分析重写ReadProcessMemory函数)

    Windows内核分析索引目录:https://www.cnblogs.com/onetrainee/p/11675224.html Windows系统调用中API的3环部分 一.R3环API分析的重 ...

  9. caffe中softmax源码阅读

    (1) softmax函数                                      (1) 其中,zj 是softmax层的bottom输入, f(zj)是softmax层的top输 ...

  10. Go 零基础 30 min 入门

        不知不觉用 Go 开发也两年多了. 筹备点经验汇总, 方便后面的同学能快速上手.  提纲     1. Go 安装     2. Go ide 搭建     3. Go modules 模块管 ...