资讯专栏INFORMATION COLUMN

JavaScript数组方法总结

Forest10 / 1369人阅读

摘要:如重排序方法它的原理是先调用数组的方法,之后再进行字符串的比较。长度为的数组。返回的是被删除的项,如果没删除则返回空数组,而且之前的数组也被改变位置方法可以检测变量,它的两个参数是第一个是要查找的值或变量,第二个是从哪开始找。

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:
在实际应用中一般类数组对象都是获取的DOM的NodeList集合,如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不同点:

他直接返回了true和false

语义化比较好

对于NAN的判断 indexOf内部使用严格相等,会导致NAN判断错误,而include使用的是不一样的判断方法,没有问题,[NaN].include(NaN) -> 0

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/96509.html

相关文章

  • JavaScript基础总结(三)——数组总结

    摘要:关于中的数组做出了如下总结数组是用来存储一组不同类型的数据的容器。可以使用构造函数的方法和字面量的方法来声明函数访问数组通过下标的方法来访问可以获得数组长度。 关于JavaScript中的数组做出了如下总结:1、数组是用来存储一组不同类型的数据的容器。可以使用构造函数的方法和字面量的方法来声明函数;访问数组通过下标的方法来访问;arr.length可以获得数组长度。2、数组栈方法包括:...

    enda 评论0 收藏0
  • JavaScript学习总结(六)数据类型和JSON格式

    摘要:并列数据的集合数组用方括号表示。第三种类型是映射,也就是一个名值对,即数据有一个名称,还有一个与之相对应的值,这又称作散列或字典,比如首都北京。中有种简单数据类型也称为基本数据类型和。数值布尔值对象和字符串值都有方法。 什么是JSON JSON:JavaScript 对象表示法(JavaScript Object Notation)。 JSON的形式是用大括号{}包围起来的项目列表...

    laznrbfe 评论0 收藏0
  • Javascript基础之Array数组API

    摘要:数组原型提供的方法非常之多,主要分为三种直接修改原数组原数组不变,返回新数组数组遍历方法直接修改原数组的删除一个数组中的最后的一个元素,并且返回这个元素添加一个或者多个元素到数组末尾,并且返回数组新的长度删除数组的第一个元素,并返回这个元素 Javascript数组原型提供的方法非常之多,主要分为三种: 直接修改原数组 原数组不变,返回新数组 数组遍历方法 直接修改原数组的API ...

    hsluoyz 评论0 收藏0
  • JavaScript遍历对象和数组方法总结

    摘要:日常开发中我们难免需要对数组和对象进行遍历,今天抽空来总结下遍历数组和对象常用的方法。使用遍历对象注只能遍历出自身可枚举的属性,而不能遍历出原型链上面的属性。 日常开发中我们难免需要对数组和对象进行遍历,今天抽空来总结下遍历数组和对象常用的方法。 Javascript遍历数组总结 我们定义一个数组 var arr = [2,4,6]; 1.使用for循环遍历 var lengt...

    jiekechoo 评论0 收藏0
  • JS程序

    摘要:设计模式是以面向对象编程为基础的,的面向对象编程和传统的的面向对象编程有些差别,这让我一开始接触的时候感到十分痛苦,但是这只能靠自己慢慢积累慢慢思考。想继续了解设计模式必须要先搞懂面向对象编程,否则只会让你自己更痛苦。 JavaScript 中的构造函数 学习总结。知识只有分享才有存在的意义。 是时候替换你的 for 循环大法了~ 《小分享》JavaScript中数组的那些迭代方法~ ...

    melody_lql 评论0 收藏0
  • 关于javascript数组方法总结

    摘要:关于数组方法的总结以此数组为操作对象以下方法不改变原数组只是数组的转换字符串使用括号中的字符串连接数组中的每个元素,返回一个连接好的字符串,不改变原数组可以将数组转换成字符串形式,返回字符串,不改变原数组。 关于数组方法的总结 【arr(1,2,3,4);以此数组为操作对象;】 以下方法不改变原数组(只是数组的转换) arr.join(字符串): 使用括号中的字符串连接数组中的每个元...

    Yi_Zhi_Yu 评论0 收藏0

发表评论

0条评论

Forest10

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<