比较两个元素是否相同
前言
之前就说过要读一下关于underscore.js的源码, 我就想先从某个函数开始读, 正好在github文章中(这里的文章我会在最后放上地址)提到了underscore中关于如何比较两个元素的是否相同, 我看完之后觉得很好玩。那么对于如何判断两个元素是否是相同呢？那么在什么程度上才算是相同, 举个例子: 1与1是相等的(当然他们前提是类型是一样的)那么1和 new Number(1)也应该相等。
underscore中有这么一个函数_.isEqual对没错, 就是这个。接下来我会以自己的知识来解释下, 这个函数的涉及的知识点。 如果有解释的不好的点, 请大家给我留言我一定改正。话不多说直接开始
分析_.isEqual
Number类型判断
console.log( _.isEqual(a, b));
我首先在 _.isEqual中传入了两个参数a, b。首先明确两个概念: 其一是a, b都是基本类型, 那么两个基本类型的值相同。其二是两个是引用类型, 那么引用类型相同。如果a === b为true, 我们是否可以说a和b是相等的。但是这里有个特殊的就是0, -0。0与-0被浏览器认为是相等的。正确来讲0与-0是不相等的(关于这里我是看了文章里面有提到, 我在控制台打印了下, 发现很神奇)。关于这里_.isEqual这样处理的。
if (a === b) return a !== 0 || 1 / a === 1 / b;我理解是这样的: 这里过滤了99%情况, 但是没有过滤掉0与-0的情况。但是return里面如果a是0, 直接就return false结束。还有就是a如果为-0呢？第一个条件满足, 我们看第二个 1 / a(-0) === -Infinity而1 / b(0) === Infinity;所以第二个条件也不满足, 那么直接返回return false. ——游戏结束。上面这种判断处理就是针对0与-0这种情况。
接下来就是 a !== b
如果a或者b其中有一个为null或者是undefined特殊处理。
if (a === null || b === null) return a === b;文章中说这里的这里的判断条件有点多余, 因为根据上面的判断条件 a === b肯定返回false。关于这里我想了想也对, 如果a === b 直接在上面的判断条件哪里直接就返回了。 所以把return a === b 替换成 retun false, 会更加清晰吧。
接下来用到了Object.prototype.toString.call, 如果判断的参数的类型不一样, 那么直接就返回return false。
var className = toString.call(a)
if (className !== toString.call(b)) return false;如果a或者b都是Number类型, 但是这里又有一个特例就是not a number也就是NaN。这里我举个栗子:
var number = new Number('s')
var number2 = new Number('s');
console.log(_.isEqual(number, number2));
这里的number与number2的值都是Number{NaN},而且又都是[object Number]。 理应来讲number与number2应该是相等的, 因为都是NaN嘛。所以这里专门针对NaN的情况做了判断, 看case里的第一个判断条件: 如果 a不等于 a那么a就是NaN, 因为NaN === NaN为false。同理b也一样如果b为NaN那么返回为true。证明a, b相等(都为NaN)。如果 b === b 返回false, 说明a, b不相等。
下面的return这里又有一个特殊处理, 是关于0的。举个例子:
var s = new Number(-0);
var a = new Number(0);
console.log(_.isEqual(s, a));
首先上面已经说过了0 === -0为true, 所以第一个条件为false。正确。同理把-0换成1, 走第二个条件也是一样, 返回false, 很明显不相等。
case '[object Number]':
// console.log('1')
// `NaN`s are equivalent, but non-reflexive.
// Object(NaN) is equivalent to NaN
if ( a !== a) return b !== b;
// console.log( b !== b);
// An `egal` comparison is performed for other numeric values.
return a === 0 ? 1 / a === 1 / b : a === b;关于对于Number类型的判断就到这里结束了。
正则RegExp和String类型判断
举个例子:
var a = /a/;
var b = new RegExp('a')
consolo.log(_.isEqual(s, a));
我们看下是如何处理这种情况的, 首先还是老样子判断属于什么类型, 发现是RegExp进入return 转换为字符串进行比较-也就是a与a进行比较为true。
String也一样,
var a = new String('s');
var b = new String('s');
同上。
case '[object RegExp]':
// RegExps are coerced to strings for comparison (Note: '' /a/i === '/a/i')
case '[object String]':
// Primitives and their corresponding object wrappers are equivalent; thus, `"5"` is
// equivalent to `new String("5")`.
return '' a === '' b;Date与Boolean类型判断
举个栗子:
还是根据数据类型选择进入:
var a = new Date(1);
var b = 1
这样进行判断就会发现通过使用 new Date()或者 new Date转换成1。这样就会发现返回true;
当然我觉得布尔类型也是如此,
var a = true;
var b = new Boolean(false);
a为true, 我们也知道true == 1, true为布尔类型进入进行隐士类型转换, b也是如此, 如果相等返回true, 否则反之。
case '[object Date]':
case '[object Boolean]':
// Coerce dates and booleans to numeric primitive values. Dates are compared by their
// millisecond representations. Note that invalid dates with millisecond representations
// of `NaN` are not equivalent.
return a === b;数组与对象类型比较
关于数组的类型比较稍微比较麻烦, 因为涉及到数组有包括对象的情况。同理, 也有可能对象里面有数组的情况。还是老样子判断是否是['object Array'];
未完待续
