当前位置 主页 > 网站技术 > 代码类 >

    判断JavaScript中的两个变量是否相等的操作符

    栏目:代码类 时间:2019-12-21 18:05

    1、为什么要判断?

    可能有些同学看到这个标题就会产生疑惑,为什么我们要判断JavaScript中的两个变量是否相等,JavaScript不是已经提供了双等号“==”以及三等号“===”给我们使用了吗?

    其实,JavaScript虽然给我们提供了相等运算符,但是还是存在一些缺陷,这些缺陷不符合我们的思维习惯,有可能在使用的时候得到一些意外的结果。为了避免这种情况的出现,我们需要自己函数来实现JavaScript变量之间的对比。

    2、JavaScript等号运算符存在哪些缺陷?

    2.1 0与-0

    在JavaScript中:

    0 === 0
    //true
    +0 === -0
    //true

    相等运算符认为+0和-0是相等的,但是我们应当认为两者是不等的,具体原因源码中给出了一个链接:Harmony egal proposal.

    2.2 null和undefined

    在JavaScript中:

    null == undefined
    //true
    null === undefined
    //false

    我们应当认为null不等于undefined,所以在比较null和undefined时,应当返回false。

    2.3 NaN

    前文有说过,NaN是一个特殊的值,它是JavaScript中唯一一个自身不等于自身的值。

    NaN == NaN
    //false
    NaN === NaN
    //false

    但是我们在对比两个NaN时,我们应当认为它们是相等的。

    2.4 数组之间的对比

    由于在JavaScript中,数组是一个对象,所以如果两个变量不是引用的同一个数组的话,即使两个数组一模一样也不会返回true。

    var a = [];
    //undefined
    var b = [];
    //undefined
    a=== b
    //false
    a==b
    //false

    但是我们应当认为,两个元素位置、顺序以及值相同的数组是相等的。

    2.5 对象之间的对比

    凡是涉及到对象的变量,只要不是引用同一个对象,都会被认为不相等。我们需要做出一些改变,两个完全一致的对象应当被认为是相等的。

    var a = {};
    //undefined
    var b = {};
    //undefined
    a == b
    //false
    a === b
    //false

    这种情况在所有JavaScript内置对象中也适用,比如我们应当认为两个一样的RegExp对象是相等的。

    2.6 基本数据类型与包装数据类型之间的对比

    在JavaScript中,数值2和Number对象2是不严格相等的:

    2 == new Number(2);
    //true
    2 === new Number(2);
    //false

    但是我们在对比2和new Number(2)时应当认为两者相等。

    3 underscore的实现方法

    我们实现的方法当然还是依赖于JavaScript相等运算符的,只不过针对特例需要有特定的处理。我们在比较之前,首先应该做的就是处理特殊情况。

    underscore的代码中,没有直接将逻辑写在_.isEqual方法中,而是定义了两个私有方法:eq和deepEq。在GitHub用户@hanzichi的repo中,我们可以看到1.8.3版本的underscore中并没有deepEq方法,为什么后来添加了呢?这是因为underscore的作者把一些特例的处理提取了出来,放到了eq方法中,而更加复杂的对象之间的对比被放到了deepEq中(同时使得deepEq方法更加便于递归调用)。这样的做法使得代码逻辑更加鲜明,方法的功能也更加单一明确,维护代码更加简洁快速。

    eq方法的源代码:

    var eq = function (a, b, aStack, bStack) {
    	// Identical objects are equal. `0 === -0`, but they aren't identical.
    	// See the [Harmony `egal` proposal](http://wiki.ecmascript.org/doku.php?id=harmony:egal).
    	//除了0 === -0这个特例之外,其余所有a === b的例子都代表它们相等。
    	//应当判断0 !== -0,但是JavaScript中0 === -0。
    	//下面这行代码就是为了解决这个问题。
    	//当a !== 0或者1/a === 1/b时返回true,一旦a === 0并且1/a !== 1/b就返回false。
    	//而a === 0且1/a !== 1/b就代表a,b有一个为0,有一个为-0。
    	if (a === b) return a !== 0 || 1 / a === 1 / b;
    	//一旦a、b不严格相等,就进入后续检测。
    	//a == b成立但是a === b不成立的例子中需要排除null和undefined,其余例子需要后续判断。
    	// `null` or `undefined` only equal to itself (strict comparison).
    	//一旦a或者b中有一个为null就代表另一个为undefined,这种情况可以直接排除。
    	if (a == null || b == null) return false;
    	// `NaN`s are equivalent, but non-reflexive.
    	//自身不等于自身的情况,一旦a,b都为NaN,则可以返回true。
    	if (a !== a) return b !== b;
    	// Exhaust primitive checks
    	//如果a,b都不为JavaScript对象,那么经过以上监测之后还不严格相等的话就可以直接断定a不等于b。
    	var type = typeof a;
    	if (type !== 'function' && type !== 'object' && typeof b != 'object') return false;
    	//如果a,b是JavaScript对象,还需要做后续深入的判断。
    	return deepEq(a, b, aStack, bStack);
    };