详解JS取出两个数组中的不同或相同元素


Posted in Javascript onMarch 20, 2019

1、取出两个数组的不同元素

var arr1 = [0,1,2,3,4,5];
var arr2 = [0,4,6,1,3,9];
function getArrDifference(arr1, arr2) {
    return arr1.concat(arr2).filter(function(v, i, arr) {
      return arr.indexOf(v) === arr.lastIndexOf(v);
    });
  }
  console.log(getArrDifference(arr1,arr2));
 
 //输出:(4) [2, 5, 6, 9]

(1)concat() 方法:用于连接两个或多个数组。

 该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本,例:

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

document.write(arr.concat(arr2));

//输出:George、John、Thomas、James、Adrew、Martin
</script>

(2)Array filter() 方法:

  1. 创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
  2. 注意: filter() 不会对空数组进行检测。
  3. 注意: filter() 不会改变原始数组。
  4. 语法:array.filter(function(currentValue,index,arr), thisValue)

(3)indexOf() 方法:

  1. 可返回某个指定的字符串值在字符串中首次出现的位置。
  2. 如果没有找到匹配的字符串则返回 -1。
  3. 注意: indexOf() 方法区分大小写。

(4)lastIndexOf() 方法:

  1. 可返回一个指定的字符串值最后出现的位置,如果指定第二个参数 start,则在一个字符串中的指定位置从后向前搜索。
  2. 注意: 该方法将从后向前检索字符串,但返回是从起始位置 (0) 开始计算子字符串最后出现的位置。 看它是否含有字符串。
  3. 开始检索的位置在字符串的 start 处或字符串的结尾(没有指定 start 时)。
  4. 如果没有找到匹配字符串则返回 -1 。
  5. 注意:lastIndexOf() 方法是区分大小写的!

 2、取出两个数组的相同元素

var arr1 = [0,1,2,3,4,5];
var arr2 = [0,4,6,1,3,9];
function getArrEqual(arr1, arr2) {
    let newArr = [];
    for (let i = 0; i < arr2.length; i++) {
      for (let j = 0; j < arr1.length; j++) {
        if(arr1[j] === arr2[i]){
          newArr.push(arr1[j]);
        }
    }
   }
   return newArr;
}
console.log(getArrEqual(arr1, arr2));
 //输出:(4) [0, 4, 1, 3]

以上所述是小编给大家介绍的JS取出两个数组中的不同或相同元素详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
浅析JQuery UI Dialog的样式设置问题
Dec 18 Javascript
JS检测输入字符是否包含非法字符的示例代码
Feb 11 Javascript
详解AngularJS中的http拦截
Feb 09 Javascript
js 上传文件预览的简单实例
Aug 16 Javascript
canvas绘制的直线动画
Jan 23 Javascript
详解vue.js+UEditor集成 [前后端分离项目]
Jul 07 Javascript
浅谈Vuex的状态管理(全家桶)
Nov 04 Javascript
微信小程序模版渲染详解
Jan 26 Javascript
React Native基础入门之调试React Native应用的一小步
Jul 02 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
Dec 28 Javascript
IDEA安装vue插件图文详解
Sep 26 Javascript
一起写一个即插即用的Vue Loading插件实现
Oct 31 Javascript
详解vue中axios的使用与封装
Mar 20 #Javascript
javascript数组去重方法总结(推荐)
Mar 20 #Javascript
浅谈JavaScript面向对象--继承
Mar 20 #Javascript
小程序显示弹窗时禁止下层的内容滚动实现方法
Mar 20 #Javascript
vue踩坑记录之数组定义和赋值问题
Mar 20 #Javascript
vue实现微信二次分享以及自定义分享的示例
Mar 20 #Javascript
vscode配置vue下的es6规范自动格式化详解
Mar 20 #Javascript
You might like
重量级动漫纷纷停播!唯独OVERLORD第四季正在英魂之刃继续更新
2020/05/06 日漫
php的memcache类分享(memcache队列)
2014/03/26 PHP
js调试工具 Javascript Debug Toolkit 2.0.0版本发布
2008/12/02 Javascript
Javascript 事件流和事件绑定
2009/07/16 Javascript
JS 控件事件小结
2012/10/31 Javascript
js模拟点击事件实现代码
2012/11/06 Javascript
使用text方法获取Html元素文本信息示例
2014/09/01 Javascript
Node.js中使用mongoskin操作mongoDB实例
2014/09/28 Javascript
javascript电商网站抢购倒计时效果实现
2015/11/19 Javascript
js剪切板应用clipboardData实例解析
2016/05/29 Javascript
nodejs实现的连接MySQL数据库功能示例
2018/01/25 NodeJs
node.js使用yargs处理命令行参数操作示例
2020/02/11 Javascript
纯JS开发baguetteBox.js响应式画廊插件
2020/06/28 Javascript
Vue-CLI 3 scp2自动部署项目至服务器的方法
2020/07/24 Javascript
JS画布动态实现黑客帝国背景效果
2020/11/08 Javascript
微信小程序tab左右滑动切换功能的实现代码
2021/02/08 Javascript
[04:36]DOTA2国际邀请赛 ti3精彩集锦
2013/08/19 DOTA
[01:34]传奇从这开始 2016国际邀请赛中国区预选赛震撼开启
2016/06/26 DOTA
[03:59]第二届DOTA2亚洲邀请赛选手传记-VGJ.rOtk
2017/04/03 DOTA
[40:12]Liquid vs Chaos 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
[01:20:38]完美世界DOTA2联赛 GXR vs IO 第一场 11.07
2020/11/09 DOTA
python概率计算器实例分析
2015/03/25 Python
python实现自动重启本程序的方法
2015/07/09 Python
Python爬虫爬取一个网页上的图片地址实例代码
2018/01/16 Python
python自定义函数实现一个数的三次方计算方法
2019/01/20 Python
python 多线程重启方法
2019/02/18 Python
Pytorch损失函数nn.NLLLoss2d()用法说明
2020/07/07 Python
20行Python代码实现一款永久免费PDF编辑工具的实现
2020/08/27 Python
浅析Python 中的 WSGI 接口和 WSGI 服务的运行
2020/12/09 Python
CSS3文本换行word-wrap解决英文文本超过固定宽度不换行
2013/10/10 HTML / CSS
人力资源管理专业自荐书范文
2014/02/10 职场文书
退休教师欢送会主持词
2014/03/31 职场文书
2015年个人现实表现材料
2014/12/10 职场文书
因公司原因离职的辞职信范文
2015/05/12 职场文书
网吧员工管理制度
2015/08/05 职场文书
python中取整数的几种方法
2021/11/07 Python