JS数组交集、并集、差集的示例代码


Posted in Javascript onAugust 23, 2017

 本文介绍了JS数组交集、并集、差集,分享给大家,具体如下:

由于下面会用到ES5的方法,低版本会存在兼容,先应添加对应的polyfill

Array.prototype.indexOf = Array.prototype.indexOf || function (searchElement, fromIndex) {
  var index = -1;
  fromIndex = fromIndex * 1 || 0;
  for (var k = 0, length = this.length; k < length; k++) {
    if (k >= fromIndex && this[k] === searchElement) {
      index = k;
      break;
    }
  }
  return index;
};

Array.prototype.filter = Array.prototype.filter || function (fn, context) {
  var arr = [];
  if (typeof fn === "function") {
    for (var k = 0, length = this.length; k < length; k++) {
      fn.call(context, this[k], k, this) && arr.push(this[k]);
    }
  }
  return arr;
};

依赖数组去重方法:

// 数组去重
Array.prototype.unique = function() {
  var n = {}, r = [];
  for (var i = 0; i < this.length; i++) {
    if (!n[this[i]]) {
      n[this[i]] = true;
      r.push(this[i]); 
    }
  }
  return r;
}

交集

交集元素由既属于集合A又属于集合B的元素组成

Array.intersect = function(arr1, arr2) {
  if(Object.prototype.toString.call(arr1) === "[object Array]" && Object.prototype.toString.call(arr2) === "[object Array]") {
    return arr1.filter(function(v){ 
     return arr2.indexOf(v)!==-1 
    }) 
  }
}
// 使用方式
Array.intersect([1,2,3,4], [3,4,5,6]); // [3,4]

并集

并集元素由集合A和集合B中所有元素去重组成

Array.union = function(arr1, arr2) {
  if(Object.prototype.toString.call(arr1) === "[object Array]" && Object.prototype.toString.call(arr2) === "[object Array]") {
    return arr1.concat(arr2).unique()
  }
}
// 使用方式
Array.union([1,2,3,4], [1,3,4,5,6]); // [1,2,3,4,5,6]

差集

A的差集:属于A集合不属于B集合的元素

B的差集:属于B集合不属于A集合的元素

Array.prototype.minus = function(arr) {
  if(Object.prototype.toString.call(arr) === "[object Array]") {
    var interArr = Array.intersect(this, arr);// 交集数组
    return this.filter(function(v){
      return interArr.indexOf(v) === -1
    })
  }
}
// 使用方式
var arr = [1,2,3,4];
arr.minus([2,4]); // [1,3]

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 常用功能总结
Mar 18 Javascript
基于jquery实现简单的手风琴特效
Nov 24 Javascript
jQuery简单验证上传文件大小及类型的方法
Jun 02 Javascript
js监听键盘事件的方法_原生和jquery的区别详解
Oct 10 Javascript
清除输入框内的空格
Dec 21 Javascript
jQuery 判断元素整理汇总
Feb 28 Javascript
JS实现遍历不规则多维数组的方法
Mar 21 Javascript
快速解决Vue项目在IE浏览器中显示空白的问题
Sep 04 Javascript
vue服务端渲染操作简单入门实例分析
Aug 28 Javascript
JavaScript setTimeout()基本用法有哪些
Nov 04 Javascript
微信小程序实现音乐播放页面布局
Dec 11 Javascript
如何管理Vue中的缓存页面
Feb 06 Vue.js
关于Vue实现组件信息的缓存问题
Aug 23 #Javascript
详解webpack进阶之loader篇
Aug 23 #Javascript
Vue中定义全局变量与常量的各种方式详解
Aug 23 #Javascript
基于JavaScript实现带数据验证和复选框的表单提交
Aug 23 #Javascript
使用JS组件实现带ToolTip验证框的实例代码
Aug 23 #Javascript
利用Vue实现移动端图片轮播组件的方法实例
Aug 23 #Javascript
详解AngularJS跨页面传值(ui-router)
Aug 23 #Javascript
You might like
星际争霸兵种名称对照表
2020/03/04 星际争霸
分割GBK中文遭遇乱码的解决方法
2013/08/09 PHP
PHP中类与对象功能、用法实例解读
2020/03/27 PHP
基于PHP实现生成随机水印图片
2020/12/09 PHP
JS中==与===操作符的比较
2009/03/21 Javascript
JavaScript内核之基本概念
2011/10/21 Javascript
简单的前端js+ajax 购物车框架(入门篇)
2011/10/29 Javascript
关于JQuery($.load)事件的用法和分析
2013/04/09 Javascript
基于JavaScript实现继承机制之调用call()与apply()的方法详解
2013/05/07 Javascript
angularJS结合canvas画图例子
2015/02/09 Javascript
javascript使用正则表达式实现去掉空格之后的字符
2015/02/15 Javascript
Position属性之relative用法
2015/12/14 Javascript
Javascript数组Array基础介绍
2016/03/13 Javascript
设置点击文本框或图片弹出日历控件的实现代码
2016/05/12 Javascript
Vue.js实现的表格增加删除demo示例
2018/05/22 Javascript
Angular2 自定义表单验证器的实现方法
2018/12/14 Javascript
jQuery基于随机数解决中午吃什么去哪吃问题示例
2018/12/29 jQuery
ES6模板字符串和标签模板的应用实例分析
2019/06/25 Javascript
angular中的post请求处理示例详解
2020/06/30 Javascript
[40:10]2015国际邀请赛全明星表演赛
2015/08/07 DOTA
Python中优化NumPy包使用性能的教程
2015/04/23 Python
从源码解析Python的Flask框架中request对象的用法
2016/06/02 Python
从头学Python之编写可执行的.py文件
2017/11/28 Python
Python openpyxl 插入折线图实例
2020/04/17 Python
python用什么编辑器进行项目开发
2020/06/17 Python
python 实现客户端与服务端的通信
2020/12/23 Python
基于HTML5超酷摄像头(HTML5 webcam)拍照功能实现代码
2012/12/13 HTML / CSS
微软加拿大官方网站:Microsoft Canada
2019/04/28 全球购物
EMPHASIS艾斐诗官网:周生生旗下原创精品珠宝品牌
2020/12/17 全球购物
国家助学金获奖感言
2014/01/31 职场文书
科技开发中心办公室主任岗位责任制
2014/02/10 职场文书
供货协议书范本
2014/04/22 职场文书
任命书格式
2014/06/05 职场文书
社区党建工作汇报材料
2014/10/27 职场文书
会议开幕词
2015/01/28 职场文书
解决Navicat for MySQL 连接 MySQL 报2005错误的问题
2021/05/29 MySQL