详解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 相关文章推荐
javascript 操作文件 实现方法小结
Jul 02 Javascript
测试JavaScript字符串处理性能的代码
Dec 07 Javascript
JavaScript中的splice()方法使用详解
Jun 09 Javascript
javascript去掉代码里面的注释
Jul 24 Javascript
JS实现在状态栏显示打字效果完整实例
Nov 02 Javascript
使用Javascript写的2048小游戏
Nov 25 Javascript
js入门之Function函数的使用方法【新手必看】
Nov 22 Javascript
node.js实现微信JS-API封装接口的示例代码
Sep 06 Javascript
极简主义法编写JavaScript类
Nov 02 Javascript
基于Bootstrap下拉框插件bootstrap-select使用方法详解
Aug 07 Javascript
vue监听用户输入和点击功能
Sep 27 Javascript
JavaScript实现猜数字游戏
May 20 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
PHP开发文件系统实例讲解
2006/10/09 PHP
php 在文件指定行插入数据的代码
2010/05/08 PHP
利用php_imagick实现复古效果的方法
2016/10/18 PHP
ModelDialog JavaScript模态对话框类代码
2011/04/17 Javascript
JavaScript版DateAdd和DateDiff函数代码
2012/03/01 Javascript
常见的原始JS选择器使用方法总结
2014/04/09 Javascript
new Date()问题在ie8下面的处理方法
2014/07/31 Javascript
nodejs命令行参数处理模块commander使用实例
2014/09/17 NodeJs
jQuery操作cookie方法实例教程
2014/11/25 Javascript
js立即执行函数: (function ( ){})( ) 与 (function ( ){}( )) 有什么区别?
2015/11/18 Javascript
可输入文字查找ajax下拉框控件 ComBox的实现方法
2016/10/25 Javascript
jQuery实现表格奇偶行显示不同背景色 就这么简单
2017/03/13 Javascript
require.js与bootstrap结合实现简单的页面登录和页面跳转功能
2017/05/12 Javascript
利用vue+elementUI实现部分引入组件的方法详解
2017/11/22 Javascript
vue实现动态添加数据滚动条自动滚动到底部的示例代码
2018/07/06 Javascript
Vue2 监听属性改变watch的实例代码
2018/08/27 Javascript
JavaScript一元正号运算符示例代码
2019/06/30 Javascript
jqGrid表格底部汇总、合计行footerrow处理
2019/08/21 Javascript
vue 中url 链接左边的小图标更改问题
2019/12/30 Javascript
python检测lvs real server状态
2014/01/22 Python
Python实现随机选择元素功能
2017/09/14 Python
Python实现Pig Latin小游戏实例代码
2018/02/02 Python
wxPython电子表格功能wx.grid实例教程
2019/11/19 Python
解决python彩色螺旋线绘制引发的问题
2019/11/23 Python
Python关于反射的实例代码分享
2020/02/20 Python
Python中过滤字符串列表的方法
2020/12/22 Python
美国著名珠宝品牌之一:Jared The Galleria Of Jewelry
2016/10/01 全球购物
运动会邀请函范文
2014/01/31 职场文书
《小蝌蚪找妈妈》教学反思
2014/02/21 职场文书
环境日宣传活动总结
2014/07/09 职场文书
大学生旷课检讨书1000字
2015/02/19 职场文书
物业客服专员岗位职责
2015/04/07 职场文书
2015年党风建设工作总结
2015/04/29 职场文书
军训后的感想
2015/08/07 职场文书
爱国主义教育主题班会
2015/08/13 职场文书
房屋转让协议书(标准范本)
2016/03/21 职场文书