JavaScript数组方法总结

发布时间:2019-08-10 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了JavaScript数组方法总结脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

length属性方法

数组length属性不单单是只读的,还可以写入
var color = [‘red’,’blue’,’black’];
Color.length = 1; // red
Color.length = 4
Console.LOG(color[2]) //undefined

检测数组方法

当有不同模块时,数组在不同模块的表现是不同的构造函数,这时候instanceof也会判断失误,这时候要用更精确的方法
Array.isArray(value)

转换方法

  • toString() -> 可以将一个数组转化成“,”分割的形式,如[1,2,3,4].toString() -> “1,2,3,4”
  • join()方法和toString()一样,只是join()里面可以添加参数,默认是逗号,如[1,2,3,4].join(‘-') -> “1-2-3-4”
  • 上面这个数组对于数组中嵌套这数组的情况,也能默认拆到底。如[1,2,3,[4,[5,6,[7,8]]]].toString() -> “1,2,3,4,5,6,7,8"

重排序方法

  • reverse()
  • sort() : 它的原理是先调用数组的toString()方法,之后再进行字符串的比较。所以应该这么写

    arr.sort((val1,val2) => val1-val2)

操作方法

  • Concat():concat()方法不会影响之前数组的值
  • Slice() : 如果是负值,则用数组的长度去和数值相加。e.g: 长度为5的数组 arr.slice(-2,-1) === arr.slice(3,4)。slice有个技巧,其实后面两个参数差的值就是数组里留的数量,比如[1,2,3,4,5].slice(1,4),截取出来的数组长度就是3。
  • splice() : 返回的是被删除的项,如果没删除则返回空数组,而且之前的数组也被改变

位置方法

indexOf:可以检测变量,它的两个参数是第一个是要查找的值或变量,第二个是从哪开始找。
var PErson = {name:'andy',age:25};
VAR a = [{name:'andy',age:25}];
var b = [person];
console.log(a.indexOf(person)) // -1
console.log(b.indexOf(person)) //0

find()和findIndex():他们的参数必须为函数,可直接返回满足条件的值和序号,还可以结合Object.is(),辨别NAN的位置
[1,2,3,4].find((n) => n>2)

迭代方法

有5个迭代方法,每个方法都接收两个参数。第一个参数是一个函数第二个参数是函数的作用域对象(可选)-影响this值,其中第一个参数的函数又有三个参数(ITem,index,arrSelf)。这5个方法都不会改变数组本身。

方法 一个普通标题 一个普通标题
every() Boolean 循环次数:碰到是flase的直接终止循环
some() Boolean 循环次数:碰到是true的直接终止循环
foreach() 无返回值 for循环迭代数组一样,没有返回值
map() 返回每次函数调用的结果组成的数组 适用于包含项与另一个数组一一对应的数组
filter() 返回true所组成的数组 查询符合条件的所有数组很有用

归并方法

reduce()和reduceRight (),这两个没区别就是一从头到尾,一个从尾到头。
他们的参数意义:
第一个参数:function (PRe,cur,index,arrSelf)
第二个参数:pre的初始值,如果这个参数没有,那么pre的初始值就是数组的第0个元素,例子:

let arr2 = [1,2,3];
let arr2All = arr2.reduce((pre,cur,index,arr) => {
console.log('pre: '+ pre)
console.log('cur: '+ cur)
console.log('index: '+ index)
console.log('arr: '+ arr)
return cur + pre;
},5)

let arr2 = [1,2,3];
var arr2All = arr2.reduce((pre,cur,index,arr) => {
console.log('pre: '+ pre)
console.log('cur: '+ cur)
console.log('index: '+ index)
console.log('arr: '+ arr)
return cur + pre;
})

Es6中数组的方法

Array.From()和扩展运算符(...)

它可以将类数组(本质特点必须有一点,有length属性)和可遍历对象(连字符串都可以)都转化为数组e.g:
在实际应用中一般类数组对象都是获取的DOMnodelist集合,如getElementByTagName()...

let arrLike = {
'0':'a',
'1':'b',
'2':'c',
length:3
}
str = [].slice.call('abc')
var arr = [].slice.call(arrLike) // [‘a’,’b’,’c’] -> es5的写法
var arr1 = Array.from(arrLike) // [‘a’,’b’,’c’]
var arr2 = […arrLike] //扩展运算符不能有这种效果
var arr3 = Array.from('arrLike’) // [‘a’,’r’,’r’,’L’,’i’,’k’,’e']

Includes()

和indexOf不同点:

  1. 他直接返回了true和false
  2. 语义化比较好
  3. 对于NAN的判断 indexOf内部使用严格相等,会导致NAN判断错误,而include使用的是不一样的判断方法,没有问题,[NaN].include(NaN) -> 0

脚本宝典总结

以上是脚本宝典为你收集整理的JavaScript数组方法总结全部内容,希望文章能够帮你解决JavaScript数组方法总结所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。