技術標籤：javascriptjavascript

在js中物件是引用型別，物件要相等除非是同一個引用，不然就不會相等，如下：

  var obj1={0:'a',1:'b',2:'c'}
   var obj2={0:'a',1:'b',2:'c'}
   console.log(obj1==obj2)
   console.log(obj1===obj2)

列印都為false，雖然他們模樣一樣，當需要判斷物件的形狀和內容都一樣的時候，就比如上面的obj1、obj2，怎麼辦呢？它來了

完整程式碼：

//判斷兩個物件是否相同（包含絕對相等和他們是否有相同的形狀）
 function looseEqual (a, b) {
    if (a === b) { //如果是絕對相等就直接返回true
    	return true ;
    }
    //如果不是絕對相等就哦按的他們是否有相同的形狀
    var isObjectA = isObject(a);
    var isObjectB = isObject(b);
    if (isObjectA && isObjectB) {//兩個均是物件
      try {
        var isArrayA = Array.isArray(a);
        var isArrayB = Array.isArray(b);
        if (isArrayA && isArrayB) {//如果都是陣列
        	if(a.length === b.length){//如果長度相等
        	    return a.every(function (e, i) {//用every和遞迴來比對a陣列和b陣列的每個元素，並返回
	           	  return looseEqual(e, b[i])
	            })
        	}
        	//長度都不等直接返回false
        	return  false;
        } else if (a instanceof Date && b instanceof Date) {//如果是Date 則直接getTime 比較
           return a.getTime() === b.getTime()
        } else if (!isArrayA && !isArrayB) {//物件的比較
          //拿到兩個物件的key
          var keysA = Object.keys(a);
          var keysB = Object.keys(b);
          if(keysA.length === keysB.length){//如果keys相等
          	  return keysA.every(function (key) {//用every和遞迴來比對a物件和b物件的每個元素值，並返回
	            return looseEqual(a[key], b[key]);
	          })
          }
          //長度都不等直接返回false
          return false;
        } else {
          return false
        }
      } catch (e) {
        return false
      }
    } else if (!isObjectA && !isObjectB) {//如果都不是物件則按String來處理
        return String(a) === String(b)
    } else {
        return false
    }
  }
  
  function isObject (obj) {
    return obj !== null && typeof obj === 'object'
  }
 

測試一波：

 //字元
   var str1="abc";
   var str2="abc";
   console.log(looseEqual(str1,str2))
   
   //數字
   var num1=12222;
   var num2=12222;
   console.log(looseEqual(num1,num2))
   
   //物件
   var obj1={0:'a',1:'b',2:'c'}
   var obj2={0:'a',1:'b',2:'c'}
   console.log(looseEqual(obj1,obj2))
   
   //物件巢狀陣列
   var obj1={0:'a',1:'b',2:[1,2,3]}
   var obj2={0:'a',1:'b',2:[1,2,3]}
   console.log(looseEqual(obj1,obj2))
   
  //類陣列
   var a={0:'a',1:'b',2:'c','length':3}
   var b={0:'a',1:'b',2:'c','length':3}
   console.log(looseEqual(a,b))
   
   //陣列
   var list=[1,2,3,4]
   var list1=[1,2,3,4]
   console.log(looseEqual(list,list1))
   
   //陣列巢狀
    list=[1,2,3,[6,7]]
    list1=[1,2,3,[6,7]]
   console.log(looseEqual(list,list1))
   
    //陣列巢狀物件
    list=[1,2,3,{a:'1',b:'7'}]
    list1=[1,2,3,{a:'1',b:'7'}]
   console.log(looseEqual(list,list1))
   
   var d1 = new Date();
   var d2 = new Date();
   console.log(looseEqual(d1,d2))
   
   var d3 = new Date();
   var d4 ;
   //使用延時來賦值d4
   setTimeout(function(){
   		d4 = new Date();
   		console.log(looseEqual(d3,d4))
   },1);
   
 

輸出結果：

除了最後一個時間的，我們用了setTimeout來驗證以外，其他的都是通過的，這個應該可以做蠻好的工具函數了吧，哈哈！！

歡迎交流！！