专栏首页鲸鱼动画JS中的数组方法

JS中的数组方法

JS中的数组方法总结

Array.push()

向数组的末尾添加一个或者多个元素,并返回新的长度 let arr =[1,2,3]; console.log(arr.push(6)) //打印结果为 4 console.log(arr) // 打印结果为 [1,2,3,6]

Array.pop()

删除数组的最后一个元素,并返回被删除的元素 let arr = [1,2,3]; console.log(arr.pop()); //打印结果 3 console.log(arr) // 打印结果 [1,2]

Array.unshift()

向数组的开头添加一个或多个元素,并返回新长度 let arr = [1,2,3]; console.log(arr.unshift(6)) //打印结果 4 console.log(arr) // 打印结果 [6,1,2,3]

Array.shift()

删除并返回数组的第一个元素 let arr = [1,2,3] console.log(arr.shift()) //打印结果 1 console.log(arr) //打印结果 [2,3]

Array.splice(a,b,c)

从下标为a的地方开始移除,移除b个,并把c放在被移除的位置,返回移除元素 let arr = [1,2,3] console.log(arr.splice(1,2,a)) //打印结果 [2,3] console.log(arr) //打印结果 [1,a]

Array.slice(a,b)

将数组中的一部分选取出来并返回成新数组,不改变原数组,不包括结束位置。该方法还可以操作字符串和substring()功能一样 let arr = [1,2,3,4] console.log(arr.slice(1,3)) //打印结果 [2,3] console.log(arr) //打印结果 [1,2,3,4]

Array.concat(arr1,arr2)

连接2个或者更多的数组,并返回连接后的新数组,该方法不会改变原数组 let arr1 = [1,2,3], arr2 = [4,5,6] let arr = arr1.concat(arr2) console.log(arr) // 打印结果 [1,2,3,4,5,6]

Array.join(分隔符)

将数组里的所有元素用分隔符连接成一个字符串,并返回该字符串,如不写参数则已逗号为分隔符 let arr = [1,2,3,4] console.log(arr.join()) //打印结果 “1,2,3,4” console.log(arr.join("+")) //打印结果 “1+2+3+4” console.log(arr) // 结果 [1,2,3,4]

Array.toString()

将数组用逗号连接作为字符串返回,和join()作用一样但是不能传参 let arr = [1,2,3] console.log(arr.toString()) //结果 “1,2,3”

Array.forEach(fn,[thisValue])

thisValue为fn中this的指向,对数组进行循坏遍历,fn可传三个参数fn(item,[index],[arr]),item为遍历过程中的当前元素,index为当前元素的下标,arr为原数组对象 let myArr = [1,2,3] myArr.forEach((item,index,arr)=>{ console.log(item,index,arr) }) /* 结果为 : 1,0,[1,2,3] 2,1,[1,2,3] 3,2,[1,2,3] */ myArr.fotEach(function(item,index,arr){ console.log(this) //结果为三个 {name:‘张三’} },{name:‘张三’})

注:箭头函数中无法改变this指向,因此如果想用thisValue参数必须使用function函数

Array.map()

对数组中的每个元素进行重新编辑,返回用编辑结果组成的新数组,传递的参数和forEach()一样 let arr = [1,2,3] let a = arr.map((item)=>{ return item+5 }) console.log(a) // 结果 [6,7,8]

Array.filter()

可以对数组进行过滤,返回过滤结果组成的数组,传递的参数和forEach()一样 let arr = [1,2,3] let a = arr.filter(item=>{ return item>2 }) console.log(a) //结果 [3]

Array.every()

用于检测数组中的每个元素是否符合某一条件,若全部符合返回true,否则返回false,传递的参数和forEach()一样 let arr = [1,2,3] let a = arr.every(item=>{ return item>2 }) console.log(a) //结果 false 1,2不大于2 let b = arr.every(item=>{ return item<4 }) console.log(b) //结果 true 都小于4

Array.some()

用于检测数组中是否有元素符合某一条件,若有返回true,否则返回false,传递的参数和forEach()一样 let arr = [1,2,3] let a = arr.some(item=>{ return item>2 }) console.log(a) //结果 true 3大于2 let b = arr.some(item=>{ return item>4 }) console.log(b) //结果 false 没有元素大于4

Array.reduce()

通过计算将数组计算为1个值,只执行arr.length-1次 arr.reduce(function(a,b,c,d)), 参数: a——初始值为数组第一个值,之后会赋值为每次循环的返回值 b——初始值为数组第二个值,之后为第三个,直到最后一个 c——b的下标 d——原数组 let arr = [1,2,3] console.log(arr.reduce(function(a,b,c,d){ return a+b })) //结果 6

Array.reduceRight()

将数组元素计算为一个值,和reduce()一样,只是循环方向相反从最后一个元素开始

Array.sort()

不传参默认按照UniCode码排序,也可以传参指定排序方法,arr.sort(fn(second,fitst)),该方法会改变原数组 let arr = [2,1,3] console.log(arr.sort((a,b)=>{ return a-b }))

//升序排列

console.log(arr.sort((a,b)=>{ return b-a }))

//降序排列

let arr1 = [ {name:‘张三’,age:19}, {name:‘李四’,age:17}, {name:‘王五’,age:20} ] console.log(arr1.sort((a,b)=>{ return a.age-b.age }))

/*结果为 [ {name:‘李四’,age:17}, {name:‘张三’,age:19}, {name:‘王五’,age:20} ] */

Array.reverse()

颠倒数组中的顺序,会改变原数组 let arr = [1,2,3] arr.reverse() console.log(arr) //结果 [3,2,1]

Array.find()

返回数组中符合条件的第一个元素,若数组中没有元素符合要求则返回undefined,不改变原数组 let arr = [1,2,3] console.log(arr.find((item)=>{ return item>1 })) //结果 2

Array.findIndex()

返回数组中符合条件的第一个元素的下标,若数组中没有元素符合要求则返回-1,不改变原数组 let arr = [1,2,3] console.log(arr.findIndex((item)=>{ return item>1 })) //结果 1

Array.includes()

判断数组是否含有某一个元素,有则返回true,没有则返回false,参数:第一个参数为查询的元素,第二个参数为查询的下标(可不填,负数为倒着数) [1,2,3].includes(2) // true [1,2,3].includes(0) // false [1,2,3].includes(2,1) // true [1,2,3].includes(2,2) // false

Array.indexOf()

查询某一元素的下标,若数组中没有该元素则返回-1,参数:第一个参数为查询元素,第二个参数为开始查询位置(选填) let arr = [1,2,3,4] console.log(arr.indexOf(2)) // 1 console.log(arr.indexOf(2,2)) // -1

Array.lastIndexOf()

查询某一元素的最大下标,若数组中没有该元素返回-1,参数:第一个参数为查询元素,第二个参数为查询结束位置的下标(选填) let arr = [1,2,3,4,2] console.log(arr.lastIndexOf(2)) // 4 console.log(arr.lastIndexOf(2,2)) // 1

Array.isArray()

判断对象是否为数组,是返回true,不是返回false let arr = [1],str=“1” Array.isArray(arr) //true Array.isArray(str) //false

Array.valueOf()

返回数组对象的原始值 let arr = [1,2,3] console.log(arr.valueOf()) //[1,2,3]

Array.entries()、Array.keys()、Array.values()

这三个方法都用于遍历数组,它们都返回一个遍历器对象,entries是对键值对遍历,values是对键值遍历,keys是对键名遍历 let arr = [“a”, “b”, “c”] let item = arr.entries() console.log(item.next().value) // [0, “a”] console.log(item.next().value) // [1, “b”] console.log(item.next().value) // [2, “c”] console.log(item.next().value) // undefined

let ikey = arr.keys() console.log(ikey.next().value) // 0 console.log(ikey.next().value) // 1 console.log(ikey.next().value) // 2 console.log(ikey.next().value) // undefined

let ivalue = arr.values() console.log(ivalue.next().value) // a console.log(ivalue.next().value) // b console.log(ivalue.next().value) // c console.log(ivalue.next().value) // undefined

Array.flat(num)

用于多维数组变成一维数组并返回,对原数组没有影响。num为转换的层数,若不确定可以写Infinity,会跳过空位 [1,2,[1,2]].flat() //[1,2,1,2] [1,2,[1,[1,2]]].flat(2) //[1,2,1,1,2] [1,[2,[3,4]]].flat(Infinity)//[1,2,3,4]

Array.flatMap()

相当于先对一个数组执行map方法,然后对返回结果再执行flat方法返回新数组,不改变原数组 [1,2,3].flatMap((item)=>{ return [item,item*item] }) //[1,1,2,4,3,9]

Array.fill()

将数组的内的元素用某一固定值代替,参数:第一个为代替值,第二个为开始下标,第二个为结束下标 let arr = [1,2,3] arr.fill(‘a’) console.log(arr) //[‘a’,‘a’,‘a’] arr.fill(1,1,2) console.log(arr) //[‘a’,1,1]

Array.copyWithin()

从数组的指定位置复制到数组的另一个位置,参数:第一个为复制到指定位置的下标,第二个为复制的开始位置,第三个为复制的结束位置(不包括该位置)。 let arr = [1,2,3,4] arr.copyWithin(2,0,2) console.log(arr) //[1,2,1,2]

Array.of()

用于构造数组 let arr = Array.of(1,2,3) console.log(arr) //[1,2,3]

Array.from()

使用方法如下 console.log(Array.from([1,2,3])) //[1,2,3] console.log(Array.from(“abcdef”)) //[‘a’,‘b’,‘c’,‘d’,‘e’,‘f’]

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 选择排序,冒泡排序

    我不是费圆
  • ES6都有什么?

    函数体只有一句,执行的结果就是返回值 多条语句用{}包裹,return返回 如果return对象: return({}) 箭头函数的this指向上一层作用...

    我不是费圆
  • 垂直居中的 8 种方式

     有些方式只适用于内联元素(行内元素),有些方式适用于所有元素,把我胸中韬略,一一展现。 在此之前,我先讲解一下W3C标准盒子模型:  所有HTML元素可...

    我不是费圆
  • 小述JavaScript数组的增删改查

    操作数组一直以来都是很头疼的问题,特别是我这样的比较菜的码农,我个人是很排斥数组这个东西的,但是很多的时候不用数组还是不行的,毕竟很多的数据只靠一个变量是远远不...

    何处锦绣不灰堆
  • 数组中的方法

    河湾欢儿
  • PHP To Go 转型手记 (二)

    作为一名PHP程序员,我感到荣幸。但在时代不断的变迁中,要具备足够的知识才可生存。

    CrazyCodes
  • 20180930_ARTS_week14

    想到这个的思路是因为解的过程中,发现如果遇到左边的,需要存起来,后面可能有用(类似入栈),遇到右边的,需要比对前一个值,并且比完如果匹配就没用了(这类似出栈)。...

    Bob.Chen
  • 前端面试题解密:经典算法之冒泡算法(ES6版)及优化

    随着前端的飞速发展,前端业务开发给前端工程师提出了更高的要求,因而算法题也越来越高频次的出现在前端面试中。有很多的小伙伴找胡哥苦诉,在前端实际开发中(除了涉及游...

    胡哥有话说
  • JavaScript 数组纯函数

    forEach 遍历所有元素,item 对应的是元素的值,index 对应的是元素的位置

    Nian糕
  • JS增删改查5

    用户7873631

扫码关注云+社区

领取腾讯云代金券