脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → js判断数组相等

js判断两个数组相等的5种方法实例

 更新时间：2022年05月06日 15:16:12   作者：祥&宇  
再最近的一次实际项目开发中,又遇到了需要对两个数组内容进行比较的需求,索性整理下,这篇文章主要给大家介绍了关于js判断两个数组相等的5种方法,需要的朋友可以参考下

前言

在 js 中是不能直接用 == 或者 === 来比较两个数组是否相等，那就需要对数组的值进行比较。

下面各种方法，要根据具体情况来使用。

一、 toString()

当两个数组元素类型相同，顺序相同时，直接判断是否相等，结果不相等；转化为字符串后，结果相等

[1,2,3].toString() === [1, 2, 3].toString(); // true
[1,2,3].toString() === ['1', 2, 3].toString(); // true

二、join()

[1,2,3,'4'].join() === [1,2,3, 4].join(); // true

三、 JSON.stringify()

JSON.stringify([{name:'许善祥'},{sex:'男'}]) == JSON.stringify([{name:'许善祥'},{sex:'男'}]); // true

四、sort()

当两个数组元素排序不相同时，先排序，再比较。如果是对象数组，可以结合 JSON.stringify 来使用。

var a = ['1', '3', '2'];
var b = ['3', '1', '2'];

var c = a.length === b.length && a.sort().toString() === b.sort().toString();

console.log(c); // true

五、filter()

var a = ['1', '3', '2'];
var b = ['3', '1', '2'];

var c = a.length === b.length && a.filter(t => !b.includes(t));

console.log(c); // true

filter() 创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
语法：
array.filter(function(currentValue,index,arr), thisValue);

附：JS要比较两个数组是否有相同的元素，即两个数组所有元素都相同，但元素的顺序不一定一致。

只就需要先将数组进行排序，再比较两个数组是否相等。

试比较以下两行代码：

<script type="text/javascript">
        alert([1,2,3].toString()== [3,2,1].toString());
        alert([1,2,3].<strong>sort</strong>().toString()== [3,2,1].<strong>sort</strong>().toString());
</script>

总结 

到此这篇关于js判断两个数组相等的文章就介绍到这了,更多相关js判断数组相等内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

相关文章

  • JS中artdialog弹出框控件之提交表单思路详解

    JS中artdialog弹出框控件之提交表单思路详解

    artDialog是一个基于javascript编写的对话框组件，它拥有精致的界面与友好的接口。本文给大家介绍JS中artdialog弹出框控件之提交表单思路详解，对本文感兴趣的朋友一起学习吧
    2016-04-04
  • 你不知道的前端console用法分享

    你不知道的前端console用法分享

    console一定是各位前端最熟悉的小伙伴了,有些网站还会在控制台输出一些有意思的东西,下面这篇文章主要给大家介绍了关于前端console用法的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-08-08
  • 三种方式实现瀑布流布局

    三种方式实现瀑布流布局

    本文主要介绍了分别使用javascript，jquery，css实现瀑布流布局的方法。具有很好的参考价值，下面跟着小编一起来看下吧
    2017-02-02
  • TypeScript中交叉类型和联合类型的区别详解

    TypeScript中交叉类型和联合类型的区别详解

    联合类型（Union Types）和交叉类型（Intersection Types）是 TypeScript 中的两种高级类型,它们都用于组合多个类型并生成新的类型,但它们两者之间的用法不一样,本文小编就给大家讲讲TypeScript中交叉类型和联合类型的区别,需要的朋友可以参考下
    2023-09-09
  • 基于JavaScript实现随机颜色输入框

    基于JavaScript实现随机颜色输入框

    这篇文章主要介绍了基于JavaScript实现随机颜色输入框的实例代码，代码简单易懂，非常不错，需要的朋友参考下吧
    2016-12-12
  • 详解bootstrap-fileinput文件上传控件的亲身实践

    详解bootstrap-fileinput文件上传控件的亲身实践

    这篇文章主要介绍了详解bootstrap-fileinput文件上传控件的亲身实践，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2019-03-03
  • 子页向父页传值示例

    子页向父页传值示例

    在某些情况下需要子页向父页传值，本文有个不错的示例，不会的朋友可以参考下
    2013-11-11
  • 详解webpack+express多页站点开发

    详解webpack+express多页站点开发

    这篇文章主要介绍了详解webpack+express多页站点开发
    2017-12-12
  • iframe子父页面调用js函数示例

    iframe子父页面调用js函数示例

    iframe子页面调用父页面js函数及iframe父页面调用子页面js函数在实际项目中都是很实用的，下面有个不错的示例，感兴趣的朋友可以了解下
    2013-11-11
  • javascript 流畅动画实现原理

    javascript 流畅动画实现原理

    浏览器目前来说是没有抗锯齿效果的(将来不一定哦)，这样dom元素外观的改变就被限制在1个像素为最佳效果。

    2009-09-09

最新评论