扩展你的javascript数组
如今做的项目用的正是jquery的框架,Jquery miniui,其功能强大、性能卓越、易于上手、不失灵活,在不断学习和研发的过程中,miniui给了非常多的启示,让我又一次认识了js的本质,意识到了js的强大功能。
使用javascript的时候难免会用到数组操作,进来js的功能越来越强大,使用范围越来越广,非常多编程语言的各种数据结构,本质上都是一样的,都是把基本数据类型做封装,形成功能各异,各有特色的对象、数组、集合等等。接下来我们重点讨论一下js的数组操作。
先说一下js的map,map本质上使用js的数组和对象相结合而实现的,能够实现存取数据,查询和删除,推断存在与否等等,既然要模仿写出就应该具备其全部功能。
关于Map的很多其它信息,请參照拙文:http://blog.csdn.net/salerzhang/article/details/41116349
两个数组的交并补集:
/**
* each是一个集合迭代函数,它接受一个函数作为參数和一组可选的參数
* 这个迭代函数依次将集合的每个元素和可选參数用函数进行计算,并将计算得的结果集返回
{%example
<script>
var a = [1,2,3,4].each(function(x){return x > 2 ? x : null});
var b = [1,2,3,4].each(function(x){return x < 0 ? x : null});
alert(a);
alert(b);
</script>
%}
* @param {Function} fn 进行迭代判定的函数
* @param more ... 零个或多个可选的用户自己定义參数
* @returns {Array} 结果集,假设没有结果,返回空集
*/
Array.prototype.each = function(fn){
fn = fn || Function.K;
var a = [];
var args = Array.prototype.slice.call(arguments, 1);
for(var i = 0; i < this.length; i++){
var res = fn.apply(this,[this[i],i].concat(args));
if(res != null) a.push(res);
}
return a;
}; /**
* 得到一个数组不反复的元素集合<br/>
* 唯一化一个数组
* @returns {Array} 由不反复元素构成的数组
*/
Array.prototype.uniquelize = function(){
var ra = new Array();
for(var i = 0; i < this.length; i ++){
if(!ra.contains(this[i])){
ra.push(this[i]);
}
}
return ra;
}; /**
* 求两个集合的补集
{%example
<script>
var a = [1,2,3,4];
var b = [3,4,5,6];
alert(Array.complement(a,b));
</script>
%}
* @param {Array} a 集合A
* @param {Array} b 集合B
* @returns {Array} 两个集合的补集
*/
Array.complement = function(a, b){
return Array.minus(Array.union(a, b),Array.intersect(a, b));
}; /**
* 求两个集合的交集
{%example
<script>
var a = [1,2,3,4];
var b = [3,4,5,6];
alert(Array.intersect(a,b));
</script>
%}
* @param {Array} a 集合A
* @param {Array} b 集合B
* @returns {Array} 两个集合的交集
*/
Array.intersect = function(a, b){
return a.uniquelize().each(function(o){return b.contains(o) ? o : null});
}; /**
* 求两个集合的差集
{%example
<script>
var a = [1,2,3,4];
var b = [3,4,5,6];
alert(Array.minus(a,b));
</script>
%}
* @param {Array} a 集合A
* @param {Array} b 集合B
* @returns {Array} 两个集合的差集
*/
Array.minus = function(a, b){
return a.uniquelize().each(function(o){return b.contains(o) ? null : o});
}; /**
* 求两个集合的并集
{%example
<script>
var a = [1,2,3,4];
var b = [3,4,5,6];
alert(Array.union(a,b));
</script>
%}
* @param {Array} a 集合A
* @param {Array} b 集合B
* @returns {Array} 两个集合的并集
*/
Array.union = function(a, b){
return a.concat(b).uniquelize();
};
推断数组是否包括某个元素,能够使用contains,也能够自定义一个方法,能够灵活来掌握比較的方式,类似于覆盖了java类中的equals方法,举例:
var objArr = [{ name: "张三", age: "24", sex: "男" }
, { name: "张二", age: "21", sex: "女" }
, { name: "张一", age: "23", sex: "男" }
, { name: "张四", age: "25", sex: "女" }
, { name: "张五", age: "22", sex: "男"}]; Array.prototype.contain=function(obj,props){
var equals = true;
for(var i = 0;i < this.length;i++){
var thisObj = this[i]; for(var j = 0;j < props.length;j++){
var prop = props[j];
equals = obj[prop] == thisObj[prop]?true:false;
if(!equals){
break;
}
}
if(equals){
break;
}
}
return equals;
}
怎样推断一个对象是否存在于数组中呢?我们扩展了contain方法,第一个參数是被查询的对象,第二參数是比較的内容(属性数组),比方:要求对象的name和age属性一直的时候就推断其相等:
var obj = {name: "张五", age: "22", sex: "男"};
var props = ["age","name"];
alert(objArr.contain(obj,props));
能够看到,alert返回的是true。
很多其它关于js数组的操作,能够參照博文:http://firepix.iteye.com/blog/1920055
关于jquery操作数组的方法參照博文:http://www.nowamagic.net/jquery/jquery_UseArray.php
扩展你的javascript数组的更多相关文章
- js 判断数组包含某值的方法 和 javascript数组扩展indexOf()方法
var questionId = []; var anSwerIdValue = []; ////javascript数组扩展indexOf()方法 Array.prototype.indexOf ...
- JavaScript数组遍历map()的原型扩展
在 JavaScript 1.6 里,javascript 数组增加了几个非常有用的方法:indexOf.lastIndexOf.every. filter. forEach. map. some,其 ...
- javascript 数组的深度复制
javascript 数组的深度复制 一般情况下,使用 "=" 可以实现赋值.但对于数组.对象.函数等这些引用类型的数据,这个符号就不好使了. 1. 数组的简单复制 1.1 简单遍 ...
- javascript数组去重算法-----3
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Ext JS学习第十天 Ext基础之 扩展原生的javascript对象(二)
此文来记录学习笔记: 今天继续说Ext.Array,Ext.Function,Ext.Date,Ext.Error ------------------------------------------ ...
- JavaScript 数组对象的去重
JavaScript数组去重 1.原型去重法.通过prototype找到数组的源性对象Array,在数组的原型上添加unique()方法.需要使用的时候使用 点 " . " 进行连 ...
- JavaScript数组去重—ES6的两种方式
说明 JavaScript数组去重这个问题,经常出现在面试题中,以前也写过一篇数组去重的文章,(JavaScript 数组去重的多种方法原理详解)但感觉代码还是有点不够简单,今天和大家再说两种方法,代 ...
- 【译】你应该了解的JavaScript数组方法
让我们来做一个大胆的声明:for循环通常是无用的,而且还导致代码难以理解.当涉及迭代数组.查找元素.或对其排序或者你想到的任何东西,都可能有一个你可以使用的数组方法. 然而,尽管这些方法很有用,但是其 ...
- Javascript数组Array的forEach方法
Javascript数组Array的forEach扩展方法 forEach是最常用到的数组扩展方法之一,相当于参数化循环数组,它简单的在数组的每一个元素上应用传入的函数,这也意味着只有存在的元素会被访 ...
随机推荐
- Cocos2dx 小技巧(十六)再谈visit(getDescription)
之前两篇都是介绍与Value相关的,这篇我继续这个话题吧,正好凑个"Value三板斧系列...".在非常久非常久曾经.我用写过一篇博客,关于怎样查看CCArray与CCDictio ...
- Maven基础教程 分类: C_OHTERS 2015-04-10 22:53 232人阅读 评论(0) 收藏
更多内容请参考官方文档:http://maven.apache.org/guides/index.html 官方文档很详细,基本上可以查找到一切相关的内容. 另外,快速入门可参考视频:孔浩的maven ...
- axios采坑之路
POST请求设置Content-Type 由于后端采用的是form表单形式上送参数,需要设置Content-Type axios设置如下 const _axios = axios.create(con ...
- 【例题3-3 UVA - 401】Palindromes
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 如果一个字符没有对应的镜像,那么它对应的是一个空格. 然后注意 aba这种情况. 这种情况下b也要查一下它的镜像是不是和b一样. [ ...
- okhttp的简介(二)之简单封装
前一篇文章简单的介绍了okhttp的简单使用.okhttp的简介(一):http://blog.csdn.net/wuyinlei/article/details/50579564 相信使用还是非常好 ...
- Android中的动画详解系列【4】——Activity之间切换动画
前面介绍了Android中的逐帧动画和补间动画,并实现了简单的自定义动画,这一篇我们来看看如何将Android中的动画运用到实际开发中的一个场景--Activity之间跳转动画. 一.定义动画资源 如 ...
- windows phone8.1:页面导航详解
小梦给大家带来windows phone 8.1应用开发实战教程,分享自己学习,开发过程中的经验和技巧. 今天给大家分享windows phone 8.1页面导航相关知识.涉及知识点如下: 页面一导航 ...
- SpringMVC接受参数若干问题
最近2年在工作问题总结中,好几次遇到了SpringMVC接收参数的问题,今天特别总结下. SpringMVC接收参数的方法: Html参数输入: <input name="stat ...
- 【34.88%】【codeforces 569C】Primes or Palindromes?
time limit per test3 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...
- Sift算子特征点提取、描述及匹配全流程解析
Sift之前的江湖 在Sift横空出世之前,特征点检测与匹配江湖上占据霸主地位的是角点检测家族.先来探究一下角点家族不为人知的恩怨情仇. 角点家族的族长是Moravec在1977年提出的Moravec ...