最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
javascript 中关于array的常用方法讲解
时间:2017-05-08 编辑:简简单单 来源:一聚教程网
javascript 中关于array的常用方法
最近总结了一些关于array中的常用方法,
其中大部分的方法来自于《JavaScript框架设计》这本书,
如果有更好的方法,或者有关于string的别的常用的方法,希望大家不吝赐教。
第一部分
数组去重,总结了一些数组去重的方法,代码如下:
代码如下 | 复制代码 |
/** * 去重操作,有序状态 * @param target * @returns {Array} */ function unique(target) { let result = []; loop:for(let i =0,n = target.length;i < n; i++) { for(let x = i +1;x < n;x++) { if(target[x] === target[i]) { continueloop; } } result.push(target[i]); } returnresult; }
/** * 去重操作,无序状态,效率最高 * @param target * @returns {Array} */ function unique1(target) { let obj = {}; for(let i =0,n = target.length; i < n;i++) { obj[target[i]] =true; } returnObject.keys(obj); }
/** * ES6写法,有序状态 * @param target * @returns {Array} */ function unique2(target) { returnArray.from(newSet(target)); }
function unique3(target) { return[...newSet(target)]; } |
第二部分
数组中获取值,包括最大值,最小值,随机值。
代码如下 | 复制代码 |
/** * 返回数组中的最小值,用于数字数组 * @param target * @returns {*} */ function min(target) { returnMath.min.apply(0,target); }
/** * 返回数组中的最大值,用于数字数组 * @param target * @returns {*} */ function max(target) { returnMath.max.apply(0,target); }
/** * 从数组中随机抽选一个元素出来 * @param target * @returns {*} */ function random(target) { returntarget[Math.floor(Math.random() * target.length)]; } |
第三部分
对数组本身的操作,包括移除值,重新洗牌,扁平化和过滤不存在的值
代码如下 | 复制代码 |
/** * 移除数组中指定位置的元素,返回布尔表示成功与否 * @param target * @param index * @returns {boolean} */ function removeAt(target,index) { return!!target.splice(index,1).length; }
/** * 移除数组中第一个匹配传参的那个元素,返回布尔表示成功与否 * @param target * @param item * @returns {boolean} */ function remove(target,item) { constindex = target.indexOf(item); if(~index) { returnremoveAt(target,index); } returnfalse; }
/** * 对数组进行洗牌 * @param array * @returns {array} */ function shuffle(array) { let m = array.length, t, i; // While there remain elements to shuffle… while(m) { // Pick a remaining element… i = Math.floor(Math.random() * m--);
// And swap it with the current element. t = array[m]; array[m] = array[i]; array[i] = t; } returnarray; }
/** * 对数组进行平坦化处理,返回一个一维的新数组 * @param target * @returns {Array} */ function flatten (target) { let result = []; target.forEach(function(item) { if(Array.isArray(item)) { result = result.concat(flatten(item)); }else{ result.push(item); } }); returnresult; }
/** * 过滤属性中的null和undefined,但不影响原数组 * @param target * @returns {Array. */ function compat(target) { returntarget.filter(function(el) { returnel !=null; }) } |
第四部分
根据指定条件对数组进行操作。
代码如下 | 复制代码 |
/** * 根据指定条件(如回调或对象的某个属性)进行分组,构成对象返回。 * @param target * @param val * @returns {{}} */ function groupBy(target,val) { var result = {}; var iterator = isFunction(val) ? val : function(obj) { returnobj[val]; }; target.forEach(function(value,index) { var key = iterator(value,index); (result[key] || (result[key] = [])).push(value); }); returnresult; } function isFunction(obj){ returnObject.prototype.toString.call(obj) ==='[object Function]' }
// 例子 function iterator(value) { if(value >10) { return'a' }elseif(value >5) { return'b' } return'c' } var target = [6,2,3,4,5,65,7,6,8,7,65,4,34,7,8]; console.log(groupBy(target,iterator));
/** * 获取对象数组的每个元素的指定属性,组成数组返回 * @param target * @param name * @returns {Array} */ function pluck(target,name) { let result = [],prop; target.forEach(function(item) { prop = item[name]; if(prop !=null) { result.push(prop); } }); returnresult; }
/** * 根据指定条件进行排序,通常用于对象数组 * @param target * @param fn * @param scope * @returns {Array} */ function sortBy(target,fn,scope) { let array = target.map(function(item,index) { return{ el: item, re: fn.call(scope,item,index) }; }).sort(function(left,right) { let a = left.re, b = right.re; returna < b ? -1: a > b ?1:0; }); returnpluck(array,'el'); } |
第五部分
数组的并集,交集和差集。
代码如下 | 复制代码 |
/** * 对两个数组取并集 * @param target * @param array * @returns {Array} */ function union(target,array) { returnunique(target.concat(array)); }
/** * ES6的并集 * @param target * @param array * @returns {Array} */ function union1(target,array) { returnArray.from(newSet([...target,...array])); }
/** * 对两个数组取交集 * @param target * @param array * @returns {Array. */ function intersect(target,array) { returntarget.filter(function(n) { return~array.indexOf(n); }) }
/** * ES6 交集 * @param target * @param array * @returns {Array} */ function intersect1(target,array) { array =newSet(array); returnArray.from(newSet([...target].filter(value => array.has(value)))); }
/** * 差集 * @param target * @param array * @returns {ArrayBuffer|Blob|Array. */ function diff(target,array) { var result = target.slice(); for(var i =0;i < result.length;i++) { for(var j =0; j < array.length;j++) { if(result[i] === array[j]) { result.splice(i,1); i--; break; } } } returnresult; }
/** * ES6 差集 * @param target * @param array * @returns {Array} */ function diff1(target,array) { array =newSet(array); returnArray.from(newSet([...target].filter(value => !array.has(value)))); } |
第六部分
数组包含指定目标。
代码如下 | 复制代码 |
/** * 判定数组是否包含指定目标 * @param target * @param item * @returns {boolean} */ functioncontains(target,item) { returntarget.indexOf(item) > -1; } |
最后模拟一下数组中的pop,oush,shift和unshift的实现原理
代码如下 | 复制代码 |
const _slice = Array.prototype.slice; Array.prototype.pop =function() { returnthis.splice(this.length - 1,1)[0]; }; Array.prototype.push =function() { this.splice.apply(this,[this.length,0].concat(_slice.call(arguments))); returnthis.length; }; Array.prototype.shift =function() { returnthis.splice(0,1)[0]; }; Array.prototype.unshift =function() { this.splice.apply(this, [0,0].concat(_slice.call(arguments))); returnthis.length; }; |
相关文章
- 无线网连接提示没有有效的IP配置解决方法 03-08
- javascript实现下雨效果 07-28
- javascript实现圣旨卷轴展开效果(代码分享) 07-20
- JavaScript实现星星等级评价功能 07-14
- javascript实现滑动解锁功能 07-14
- 十大热门的JavaScript框架和库 07-13