判断两个数组是否相等一般有两种场景。 第一种是数组完全相等,即数组元素相同且元素顺序一致; 第二则为元素相同但顺序不同。数组完全相等 如果数组元素只是字符串,数字,布尔值这些类型,可以考虑使用JSON。stringify或者join()的做法,目的就是转为字符串,直接判断字符串是否相等,比如:基于join解决基本判断constisArrEqual(arr1,arr2){returnarr1。join()arr2。join();};isArrEqual(〔1,2,3〕,〔1,2,3〕);trueisArrEqual(〔1,,b,false〕,〔1,,b,false〕);trueisArrEqual(〔1〕,〔1,2〕);false基于JSON。stringify解决基本判断constisArrEqual(arr1,arr2){returnJSON。stringify(arr1)JSON。stringify(arr2);};isArrEqual(〔1,2,3〕,〔1,2,3〕);trueisArrEqual(〔1,,b,false〕,〔1,,b,false〕);trueisArrEqual(〔1〕,〔1,2〕);false 但上述两种做法,都无法对比数组中包含undefined,null的情况,比如如下对比就暴露了问题:〔undefined,1,null,false〕。join()〔,1,null,false〕。join();true 这是因为对于join而言,undefined与null都会被转为空字符串,所以上述代码左右两边得到的都是1flase,因此相等。 而对于JSON。stringify而言同样会存在这样的问题,比如如下例子:JSON。stringify(〔undefined,1,NaN〕)JSON。stringify(〔null,1,null〕);true 这是因为对于JSON。stringify而言,undefined和NaN都会被转为null,这才导致上述代码相等。 因此考虑基本数据类型以及NaN,其实可以这么实现它:constisArrEqual(arr1,arr2){returnarr1。lengtharr2。lengtharr1。every((ele,index)Object。is(ele,arr2〔index〕));};isArrEqual(〔1,b,false,undefined,null,NaN〕,〔1,b,false,undefined,null,NaN〕);true 这里利用了Object。is方法,它接受两个参数,用于核对这两个参数是否相等,即便是NaN它也能有效判断。 在导入excel表格场景中,也可以使用此方法来校验表头,判断是否使用正确的导入模版。元素相同顺序不同 有这样一种场景,我们认定两个元素相同但顺序不同的数组为相同数组,比如数组〔A,B〕与〔B,A〕是相同数组。 比如一个功能设置模块,默认就勾选了〔A,B〕两个选项,下方会有一个更新按钮,只有用户修改了设置才会将更新按钮变为可点击状态,毕竟设置没改,就没更新的必要。 考虑到实际场景中对于值的唯一性维护,因此数组中理论上不会存在相同的值,因此我们可以这么实现:constisArrEqual(arr1,arr2){returnarr1。lengtharr2。lengtharr1。every((ele)arr2。includes(ele));};isArrEqual(〔1,b,false,undefined,null,NaN〕,〔1,null,b,undefined,false,NaN〕);true 注意,上述实现是考虑到特殊场景不会让数组有重复项,因此可以这么实现,但如果数组有重复元素上述实现就不可行,比如这个例子就不OK:isArrEqual(〔1,1〕,〔1,null〕);true 针对这种情况还是得考虑将两个数组进行排序,再按数组完全相等的思路对每一位进行对比。constisArrEqual(arr1,arr2){returnarr1。lengtharr2。lengtharr1。sort()。every((ele,index)Object。is(ele,arr2。sort()〔index〕));};isArrEqual(〔1,1〕,〔1,null〕);falseisArrEqual(〔null,1〕,〔1,null〕);true