数组的基本使用


  • var arr=[3,4,5,6]
  • arr.length
  • arr[0]
  • arr[4]...undefined
  • arr[4]=8...给数组新增一个值
  • arr.length=0...将数组清空
  • arr[arr.length-1]...访问数组最后一位元素
  • arr.push(element)...在数组最后添加一位元素,返回数组长度
  • arr.pop()...返回值是数组最后一位元素,并将其从数组中删除
  • arr.unshift(element)...在数组第一位增加一个元素,返回数组长度
  • arr.shift()...返回数组第一位元素,并将其从数组中删除
  • arr.splice(element,index,add)...用的最广,可在任意位置增删元素(splice:拼接,接合)

a=[3,4,5];
a.splice(0,1);
表示数组从第0位开始,删除了一位数,所以数组变为[4,5],返回的值是被删掉的值
a=[3,4,5];
a.splice[0,0,1,2];
表示从第0位开始,删除0位数,并增加元素1和2,返回值是空[]

  • arr.slice(xx,xx)...从数组中截取一段值出来,不改变原数组
  • arr.join('')...将数组变为字符串,如[3,4,5]变成“345”
  • arr.join(:)...给每位元素间加冒号,如3:4:5
  • arr.reverse()...让数组倒排
  • arr.concat...将数组连接成一个新数组,如a.concat(b),将a与b连接为一个新数组,不会改变原数组;可以用于深拷贝,如arr2=arr.concat[],将arr的值赋给arr2,但同时改变arr2对arr没有影响
  • arr.sort()...排序

arr=[3,8,7,9];
arr.sort(),arr变为[3,7,8,9]
若既有数字又有字母,则先排数字
但:[7,8,10,11]会排成[10,11,7,8],因为它会先比较第一个数字
可以用arr.sort(function(v1,v2){
reture v1>v2})来调整,即,如果v1是大于v2的就交换他俩的位置,若小于,则不替换。
还可以对数组中的对象成员进行排序,如下例所示:
var friends = [{name:'bob',age:3}, {name:'cindy',age:4},{name:'davy',age:5}];
friends.sort(function(v1,v2){
return v1.age > v2.age;
})
console.log(friends);


ES5数组拓展

  • Array.isArray(obj)...用来判断一个对象是否为数组,若是,则返回true
  • .indexOf(element)/lastindexOf(element)...用来查找元素的位置,从左到右(从右到左))查到第一个后返回其索引,没找到返回-1
  • .forEach(function(element,index,array){})...可以对数组中每一个元素操作
  • .every(function(value){return value>0?true:false})...如果数组中每一项都大于0则返回true
  • .some(function(value){return value>0?true:false})...只要数组中有大于0的数则返回true
  • .map(function(element){})...与forEach类似,遍历数组,回调函数返回值,组成一个新数组返回,原数组不变

var arr2=arr.map(function(value){return value*value})

  • .filter(function(element){})...过滤数组,返回数组的一个子集,数组本身不改变

var arr=[3,4,-1,5];
var arr2=arr.filter(function(value){
return value>0
})
还可过滤出数组元素中含某字母的元素
var namehasc=["a","ce","c","d"].filter(function(element){
return element.indexOf("c")>-1;
})
返回的为["ce","c"]

  • .reduce(function(){})...让数组中的前一项与后一项做某种计算,并累计最终值,同样得将其赋给新的变量

var a=[1,2,3,4];
var b=a.reduce(function(x,y){
return x+y})
返回的值为10

  • 手写一个reduce函数,见下例:

function reduce(arr,fn,initValue){
var arr2 = (initValue === undefined?[]:[initValue]).concat(arr);
for(var i=0;i<arr2.length;i++){
if(arr2.length>1){
arr2.splice(0,2,fn(arr2[0],arr2[1]))
i--;
}else{
return arr2[0];
}
}
}
var result = reduce([2,3,4],function(v1,v2){
return v1+v2;
},100);
console.log(result);//109

  • 扁平化数组

var arr=[3,[2,-4,[5,7]],-3];
function flatten(arr){
var newArr=[];
function flat(arr){
arr.forEach(val){
if(Array.isArray(val)){
flat(val)
}else{
newArr.push(val)
}
})
}(递归法)
flat(arr)
return newArr

  • 对数组应用Math方法取最大、最小值可用 apply,如下:

Math.max.apply(null,[3,4,5]);//5

参考文献:
https://aotu.io/notes/2016/04/14/js-reduce/index.html
http://book.jirengu.com/fe/%E5%89%8D%E7%AB%AF%E5%9F%BA%E7%A1%80/Javascript/es5array.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Javascript有很多数组的方法,有的人有W3C的API,还可以去MDN上去找,但是我觉得API上说的不全,M...
    顽皮的雪狐七七阅读 9,720评论 0 6
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,086评论 1 45
  • 转载:在开发中,数组的使用场景非常多,平日中也涉及到很多数组的api/相关操作,一直也没有对这块内容进行一块整理总...
    七色烟火阅读 8,494评论 0 3
  • 已经到下午了还没有写昨天的简书,昨天晚上手机没电了,冲上电后然后手机锁屏了,需要密码解锁,自己一下子想不起来...
    洪兴Yoga阅读 1,098评论 0 1
  • 喜欢他的第N+1天 突然出现在我身后,就莫名其妙不知不觉地跟他走。 喜欢一个人是一件羞耻的事吗? 当然不,已不再...
    范宁_阅读 1,020评论 0 0