当前位置: 首页 > Web前端 > HTML5

JavaScript数组方法

时间:2023-04-05 17:53:23 HTML5

前言从事前端工作快两年了。我通常会收集整理一些笔记,放在印象笔记里。把内容用自己的话讲清楚后,我开始整合之前零零散散的东西,和道友们一起提高。操作数组的方法有很多种。让我们系统地梳理一下。Array.map()该方法为数组中的每个元素调用一个提供的函数,并在不改变原始数组的情况下将结果作为一个新数组返回。letarr=[1,2,3,4,5]letnewArr=arr.map(x=>x*2)//arr=[1,2,3,4,5]原数组不变//newArr=[2,4,6,8,10]返回一个新数组Array.forEach()该方法是将数组中的每个元素传递给提供的函数。没有返回值,直接改原数组。注意和map方法不同letarr=[1,2,3,4,5]num.forEach(x=>x*2)//arr=[2,4,6,8,10]array变化,注意区分Array.filter和map()这个方法是判断所有元素,将满足条件的元素作为新数组返回letarr=[1,2,3,4,5]constisBigEnough=>value=>value>=3letnewArr=arr.filter(isBigEnough)//newNum=[3,4,5]将满足条件的元素作为新数组返回Array.every()这个方法是判断所有元素并返回一个布尔值,如果所有元素都满足判断条件,返回true,否则返回falseletarr=[1,2,3,4,5]constisLessThan4=>value=>value<4constisLessThan6=>value=>值<6arr.every(isLessThan4)//falsearr.every(isLessThan6)//trueArray.some()这个方法是判断所有元素,返回一个布尔值。如果存在满足判断条件的元素,则返回true。如果所有元素都不满足判断条件,则返回false。让arr=[1,2,3,4,5]constisLessThan4=>value=>value<4constisLessThan6=>value=>value>6arr.some(isLessThan4)//truearr.some(isLessThan6)//假数组。reduce()这个方法会调用所有元素的返回函数,返回值就是最终的结果。传入的值必须是函数类型letarr=[1,2,3,4,5]constadd=(a,b)=>a+bletsum=arr.reduce(add)//sum=15相当于积累的效果。相应的,还有一个Array.reduceRight()方法。不同的是,这是一个从右向左操作的Array.push()这个方法是在数组的末尾添加新的元素,这个方法改变数组的长度letarr=[1,2,3,4,5]arr.push(6,7)console.log(arr)//[1,2,3,4,5,6,7]console.log(arr.length)//7Array.pop()该方法删除数组后的最后一个元素并返回数组,该方法改变了数组的长度letarr=[1,2,3,4,5]arr.pop()console.log(arr)//[1,2,3,4]console.log(arr.length)//4Array.shift()该方法删除数组后的第一个元素,返回数组。这个方法改变数组的长度letarr=[1,2,3,4,5]arr.shift()console.log(arr)//[2,3,4,5]console.log(arr.length)//4Array.unshift()这个方法是在数组的开头添加一个或多个元素,并返回新数组的长度letarr=[1,2,3,4,5]arr.unshift(6,7)console.log(arr)//[6,7,2,3,4,5]console.log(arr.length)//7Array.isArray()判断是否一个对象是不是数组,它返回一个布尔值Array.concat()这个方法是可以将多个数组拼接成一个数组的方法letarr1=[1,2,3]arr2=[4,5]letarr=arr1.concat(arr2)console.log(arr)//[1,2,3,4,5]Array.toString()这个方法将数组转换成字符串letarr=[1,2,3,4,5];letstr=arr.toString()console.log(str)//1,2,3,4,5Array.join()这个方法也是把数组转成字符串letarr=[1,2,3,4,5];letstr1=arr.toString()letstr2=arr.toString(',')letstr3=arr.toString('##')console.log(str1)//12345console.log(str2)//1,2,3,4,5console.log(str3)//1##2##3##4##5通过例子可以看出和toString的区别,可以设置元素之间的间隔~15.Array.splice(起始位置,删除个数,元素)通用方法,可以增删改letarr=[1,2,3,4,5];让arr1=arr.splice(2,0'哈哈')让arr2=arr.splice(2,3)让arr1=arr.splice(2,1'haha')console.log(arr1)//[1,2,'haha',3,4,5]添加一个元素console.log(arr2)//[1,2]删除三个元素console.log(arr3)//[1,2,'haha',4,5]替换末尾的一个元素。第一次写是很简单的数组用法。千里之行,始于足下。重新打基础,如果有错误或者表达不当,请及时告诉我,thx参考MDN语法还有很多有趣的方法来demo《JavaScript高级权威指南 》数组操作