js中Array的方法简介-CSDN博客

亲爱的小伙伴我在之前的文章中写过js Array的详细方法，但是过于详细，文章太长了，今天我就简单的总结一下。也分享一下学习这些方法经验，这些经验仅供产考，大家如有有更好的方法也可以评论，分享一下。

学习数组的方法是，咱们大家不妨看看，怎么效率更高，我在学习这些方法的时候，分一下，类别去学

方法的功能是什么
- 需不要传入参数
- 有没有改变原数组
- 返回结果是什么

咱们先按功能分

数组的转换方法 join()、toString()、valueOf()、toLocaleString()
增加个删除方法 push() unshift() shift() pop()
操作 concat() slice() splice()
排序 sort() reverse()
遍历方法 filter() map() forEach() some() every()
递归方法 reduce() reduceRight()
检查方法 indexOf() lastIndexOf()

转换方法

join（）
- 功能是把数组变成字符串，每项都以特定的字符串隔开。
- 参数（可选）
  - 无参是该方法和toString（）的返回值一样，数组变成字符串并且每项字符以逗号隔开例如[1,2,3].join()===[1,2,3].toString()===”1,2,3“
  - 有参数，数组变成字符串，每项都以特定的”参数“隔开。例如[1,2,3].join('|')==='1|2|3'
- 原数组不发生变化
- 返回每项都以特定的字符串隔开的字符串
toString()
- 功能是把数组变成字符串，每项都以逗号隔开，调用的是数字每项的toString
- 无参数例如 [1,2,3].toString()===”1,2,3“
- 原数组不发生变化
- 返回每项都以逗号隔开的字符串
valueOf()
- 取数组的原始值
- 无参数例如 [1,2,3].valueOf() //[1,2,3]
- 原数组不发生变化
- 返回原数组的备份
toLocaleString()
- 功能是把数组变成字符串，每项都以逗号隔开，调用的是数字每项的toLocaleString,一般情况下和toString返回结果一样，但是由于浏览器实现的不同有时候返回的也不同
- 无参数例如 [1,2,3].toLocaleString()===”1,2,3“
- 原数组不发生变化
- 返回原数组的备份

这几个方法在不传入参数的情况下，都会对null、undefned、""进行过滤例[,null,undefined].toString()//",, "
例[,null,undefined].join()//",," 例[,null,undefined].join('')//""
增删改方法

push（）
- 功能是在原数组的末尾添加一项或者多项，根据参数而定
- 参数需要添加到数组末尾的项，一项或者多项，例如 var arr=[1,2];arr.push(3,4,5); console.log(arr) // [1,2,3,4,5];
- 原数组发生改变
- 返回改变后数组的length
unshift（）
- 功能是在原数组的前端添加一项或者多项，根据参数而定
- 参数需要添加到数组前端的项，一项或者多项，例如 var arr=[1,2];arr.unshift(3,4,5); console.log(arr) // [3,4,5,1,2];
- 原数组发生改变
- 返回改变后数组的length
shift（）
- 功能是在原数组的最前端删除一项
- 参数无 arr=[1,2];arr.shift(); console.log(arr) // [2];
- 原数组发生改变
- 返回删除的该项
pop（）
- 功能是在原数组的最末端删除一项
- 参数无 arr=[1,2];arr.pop(); console.log(arr) // [1];
- 原数组发生改变
- 返回删除的该项

操作方法

concat（）
- 功能连接两个数组
- 参数（可选）
  - 无列 [1,2,3].concat()返回的是[1,2,3]
  - 有列 [1,2,3].concat([4,5,6])返回的是[1,2,3,4,5,6]
- 原数组不发生改变
- 返回的是原数组的备份加上参数数组的合并
slice（）
- 通过参数（m，n）截取数组的某些部分，或者全部参数（m，n）
  - 不传入参数或者传入0，会创建一个原数组的副本，返回
  - 传入的m 大于或者等于n 则返回一个[]
  - 传入的m 小于n 则返回一个起始位置为n到m位置的数组，但是不包含m位置的拿一项
  - 如果 m和n都是负数并m小于n，这个数组的长度数x，则会返回一个x+（-m）起始项，到结束位置x+（-n)项的数组，但是不包含结束位置x+（-n)项
- 原数组不发生改变
- 返回的截取数组的某些部分，或者全部
splice（）
- 通过参数（m，n, a）可以实现通过索引添加，删除，修改参数（m，n）
- 参数（m，n, a）
  - 删除：可以删除任意数量的项，但是要指定两个参数：要删除的第一项的位置和要删除的项数。例如，splice(0,2)会删除数组中的前两项。
  - 插入：可以向指定位置插入任何数量的项，只需要提供3个参数：起始位置、要删除的项数、要插入的项。如果要插入多个项，可以再传入任意多个项。例如[1,2,3].splice(2,0,4,5,6,7)则会在在数组[1,2,3]的3后面添加4，5，6，7最后数组变成[1,2,3,4,5,6,7].
  - 替换：可以在指定的位置插入任何数量的项，且同时删除任意数量的项，需要指定3个参数：其实位置、要删除的项的任意数量，要插入数组的项，要插入的数组项没有必要和删除项的数量相等例如，[1,2,3,4,5].splice(0,1,0,1) 返回的是截取的那一项1，并在原数组内添加0，1，原数组变成 [0,1,2,3,4,5]
- 原数组发生改变
- 返回的是一个数组，里面包含删除项

排序方法

sort（）
- 功能返回一个经过排序好的数组
- 参数可选
  - 无参数将当前数组的每项进行过toString(),然后再以升序的方式排序数组，例 var arr=[1,5,15,10] arr.sort(); console.log(arr)//[1,10,15,5]
  - 有参数该函数的参数是一个函数，该参数函数需要返回一个大于0会在小于0的数,例 var arr=[1,15,16,10];arr.sort((prev,next)=>(prev-next));console.log(arr)//[1,10,15,16]; 降序的只需眼修改成return next-prev 例 var arr=[1,15,16,10];arr.sort((prev,next)=>(next-prev));console.log(arr)//[16，15，10，1];
- 原数组发生改变
- 返回的是一个排序好的数组
reverse（）
- 功能数组进行反转
- 参数无
- 原数组发生改变
- 返回一个经过反转的数组

遍历方法
ECMAScript5 为数组定义了5个迭代的方法。每个方法都会有两个参数;要在每一项上运行的函数和（可选的）运行该函数的作用域---影响this的值。传入这些方法中的函数会接受三个参数；数组项的值、该项在数组中的位置，数组对象本身。根据使用的方法不同，这个函数执行后的返回值也是不同的，看下面五个方法的作用

every():对数组中的每一项运行给定函数，如果每一项都返回true，则返回true。
- 功能遍历数组每项，对传入的验证函数进行执行，如果每一项都返回true，则返回true。例
  - var numbers = [1,2,3,4,5,6,7]; var everyResult = numbers.every((item,index,arry)=>(item>2)); alert(everyResult);// false
- 参数有两个一个是验证的函数，另个一（可选）当前函数的this 上下文
- 原数组不改变
- 返回true或false
some()：对数组中的每一项运行给定函数，如果任意一项都返回true，则返回true。
- 功能遍历数组每项，对传入的验证函数进行执行，如果任意一项都返回true，则返回true。例
  - var someResult = numbers.some((item,index,arr)=(item>2)) alert(someResult);//true
- 参数有两个一个是验证的函数，另个一（可选）当前函数的this 上下文
- 原数组不改变
- 返回true或false
filter()：对数组中的每一项运行给定函数，返回该函数返回true的项数组
- 功能遍历数组每项，对传入的验证函数进行执行，如果任意一项都返回true，返回数组该项该项
- 参数有两个一个是验证的函数，另个一（可选）当前函数的this 上下文例
  - var numbers = [1,2,3,4,3,2,1]; var filterResult = numbers.filter((item,index,array)=>(item>2))alert(filterReault);//[3,4,3]
- 原数组不改变
- 返回数组
map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。
- 功能遍历数组每项返回每次函数调用的结果组成的数组。
- 参数有两个一个是验证的函数，另个一（可选）当前函数的this 上下文例
  - var numbers = [1,2,3,4,5,6]; var mapRes = numbers.map((item,index,array)=>(item*2)) alert(mapRes);//[2,4,6,8,12]
- 原数组不改变
- 返回一个新的组合数组
forEach():对数组的每一项给定一个函数，这个方法没有任何的返回值。
- 功能遍历数组每项，对数组的每一项给定一个函数
- 参数有两个一个是验证的函数，另个一（可选）当前函数的this 上下文，例
  - var numbers = [1,2,3,4,5,6]; numbers.forEach((item,index,array)={ // 执行某些操作 })
- 原数组不改变
- 返回无

递归方法

ECMAScript5 还新增了两个递归数组方法：redurce()和redurceRight()。这两个方法都会迭代数组的所有项，然后构建一个最终返回的值。其中，redurce()方法从数组的第一项开始，逐个遍历到最后。而redurceRight()则从数组的最后一项开始，向前遍历到第一项

reduce()
- 功能从前端面迭代数组的所有项，然后构建一个最终返回的值
- 参数有两个一个是函数，另个一（可选）当前函数的第一次的第一个参数，例 *var values = [1,2,3,4,5]; var sum = values.reduce((prev,cur,index,array)=>(prev+cur)) alert(sum) ;// 15
- 原数组不改变
- 返回累计的和
reduceRight()
- 功能从末端面迭代数组的所有项，然后构建一个最终返回的值
- 参数有两个一个是函数，另个一（可选）当前函数的第一次的第一个参数，例 *var values = [1,2,3,4,5]; var sum = values.而reduceRight((prev,cur,index,array)=>(prev+cur)) alert(sum) ;// 15
- 原数组不改变
- 返回累计的和