当前位置:网站首页>js常用数组方法
js常用数组方法
2022-04-23 07:01:00 【凌儿~】
js常用数组方法
- js常用数组方法
-
- 会改变原数组
-
- 1.Array.push(),向数组的末尾添加一个或多个元素,并返回新的数组长度。会改变原数组。
- 2.Array.pop(),删除并返回数组的最后一个元素,若数组为空,则返回undefined。会改变原数组。
- 3.Array.unshift(),向数组的开头添加一个或多个元素,并返回新的数组长度。会改变原数组。
- 4.Array.shift(),删除数组的第一项,并返回第一个元素的值。若该数组为空,则返回undefined。会改变原数组。
- 5.Array.reverse(),将数组倒序。会改变原数组。
- 6.Array.sort(),对数组按照字符串UniCode码排序或自定义的函数排序。会改变原数组。
- 7.Array.splice(index(开始的位置的索引),delNum(删除元素的个数,为0则不删除),arr1,arr2…),对数组进行增删查改。arr1,arr2…为插入的元素。会改变原数组。
- 不会改变原数组
-
- 8.Array.concat(arr1,arr2…),合并两个或多个数组,生成一个新的数组。原数组不变。
- 9.Array.join(),将数组的每一项用指定字符连接形成一个字符串。默认连接字符为“,”逗号。原数组不变。
- 10.Array.includes() 判断一个数组是否包含一个指定的值。有则返回true,没有则返回false。
- 11.Array.slice(start,end),从start开始,到end(不包括end),截取这些数组元素并返回到一个新数组。如果没有end,则截取start之后的所有数组元素。start和end可以给负值(加负号后就是倒着数的)。原数组不变。
- 12.Array.filter(),通过自定义条件来过滤数组,会将满足条件的元素会返回到一个新的数组。
- 13.Array.every(),通过自定义条件来判断,若所有数组元素都满足条件则返回true,否则返回false。
- 14.Array.some(),通过自定义条件来判断,有一个数组元素满足条件则返回true,否则返回。
- 15.Array.reduce(),通过回调函数来对数组中的每一个值(从第一个元素开始),开始计算,最后返回最终结果。
- 16.Array.indexOf() 搜索数组中的元素,并返回它所在的位置。返回的结果是元素的索引,没有的话则会返回-1。
- 17.Array.findIndex() 返回符合回调函数的数组元素的索引。只会返回第一个符合条件的元素的索引。
- 18.**Array.find()**返回符合回调函数的数组元素。只会返回第一个符合条件的数组元素。
- 19.Array.flat() 嵌套数组转一维数组,参数是数字,表示转换几维数组,参数为Infinity时,无论多少维数组都转为一维数组。
- 20.**Array.map()**方法,遍历数组中的每一项并操作,同时返回一个新的数组。原数组不变。(类似forEach)。
- 21.Array.forEach(),和for方法一样,遍历数组中的每一个元素,并将元素值和索引传进回调函数。原数组不变。
- ES6新增了两个方法
js常用数组方法
会改变原数组
1.Array.push(),向数组的末尾添加一个或多个元素,并返回新的数组长度。会改变原数组。
let arr = [1,2,3]
let res = arr.push(6) //返回数组的长度,原数组改变
console.log(arr) //[ 1, 2, 3, 6 ]
console.log(res) //4
2.Array.pop(),删除并返回数组的最后一个元素,若数组为空,则返回undefined。会改变原数组。
let arr = [1,2,3]
let res = arr.pop() //删除数组的最后一个元素,并返回删除的数据,原数组改变
console.log(res) //3
console.log(arr) //[ 1, 2]
3.Array.unshift(),向数组的开头添加一个或多个元素,并返回新的数组长度。会改变原数组。
let arr = [1,2,3]
let res = arr.unshift(1)// 向数组的开头添加一个或多个元素,并返回新的数组长度,原数组改变
console.log(res) //4
console.log(arr) //[ 1, 1, 2, 3]
4.Array.shift(),删除数组的第一项,并返回第一个元素的值。若该数组为空,则返回undefined。会改变原数组。
let arr = [1,2,3]
let res = arr.shift()//删除数组的第一项,并返回第一个元素的值
console.log(res) //1
console.log(arr) //[ 2, 3 ]
5.Array.reverse(),将数组倒序。会改变原数组。
let arr1 = [1,2,3]
let arr2 = [4,5]
let res = arr1.reverse()
console.log(res,typeof res) // [ 3, 2, 1 ] object
console.log(arr1) //[ 3, 2, 1 ]
console.log(arr2) //[ 4, 5 ]
6.Array.sort(),对数组按照字符串UniCode码排序或自定义的函数排序。会改变原数组。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.sort()
console.log(res,typeof res) // [ 1, '10', 'a1', 'f' ] object
console.log(arr1) //[ 1, '10', 'a1', 'f' ]
console.log(arr2) //[ 4, 5 ]
7.Array.splice(index(开始的位置的索引),delNum(删除元素的个数,为0则不删除),arr1,arr2…),对数组进行增删查改。arr1,arr2…为插入的元素。会改变原数组。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.splice(1,2,3,4,5)
console.log(res) //[ 1, '10' ]
console.log(arr1)//[ 'a1', 3, 4, 5, 'f' ]
不会改变原数组
8.Array.concat(arr1,arr2…),合并两个或多个数组,生成一个新的数组。原数组不变。
let arr1 = [1,2,3]
let arr2 = [4,5]
let res = arr1.concat(arr2)
console.log(res) //[ 1, 2, 3, 4, 5 ] //合并两个或多个数组,生成一个新的数组
console.log(arr1) //[ 1, 2, 3 ]
console.log(arr2) //[ 4, 5 ]
9.Array.join(),将数组的每一项用指定字符连接形成一个字符串。默认连接字符为“,”逗号。原数组不变。
let arr1 = [1,2,3]
let arr2 = [4,5]
let res = arr1.join('/')
console.log(res,typeof res) // 1/2/3 string
console.log(arr1) //[ 1, 2, 3 ]
console.log(arr2) //[ 4, 5 ]
10.Array.includes() 判断一个数组是否包含一个指定的值。有则返回true,没有则返回false。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.includes('10')
console.log(res) //true
11.Array.slice(start,end),从start开始,到end(不包括end),截取这些数组元素并返回到一个新数组。如果没有end,则截取start之后的所有数组元素。start和end可以给负值(加负号后就是倒着数的)。原数组不变。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.slice(1)
console.log(res) //[ 1, '10', 'f' ]
12.Array.filter(),通过自定义条件来过滤数组,会将满足条件的元素会返回到一个新的数组。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.filter((v)=>v>3)
console.log(res) //[ '10' ]
console.log(arr1)//[ 'a1', 1, '10', 'f' ]
13.Array.every(),通过自定义条件来判断,若所有数组元素都满足条件则返回true,否则返回false。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.every((v)=>v>3)
console.log(res) //false
14.Array.some(),通过自定义条件来判断,有一个数组元素满足条件则返回true,否则返回。
let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.some((v)=>v>3)
console.log(res) //true
15.Array.reduce(),通过回调函数来对数组中的每一个值(从第一个元素开始),开始计算,最后返回最终结果。
let arr1 = [1,2,3,43]
let arr2 = [4,5]
let res = arr1.reduce((a,b)=> a+b)
console.log(res) //49
console.log(arr1)//[ 1, 2, 3, 43 ]
16.Array.indexOf() 搜索数组中的元素,并返回它所在的位置。返回的结果是元素的索引,没有的话则会返回-1。
let arr1 = [1,2,3,43]
let arr2 = [4,5]
let res = arr1.indexOf(1)
console.log(res) //0
console.log(arr1)//[ 1, 2, 3, 43 ]
17.Array.findIndex() 返回符合回调函数的数组元素的索引。只会返回第一个符合条件的元素的索引。
let arr1 = [1,2,3,43,1,3]
let arr2 = [4,5]
let res = arr1.findIndex(item => item>2)
console.log(res) //2
console.log(arr1)//[ 1, 2, 3, 43, 1, 3 ]
18.**Array.find()**返回符合回调函数的数组元素。只会返回第一个符合条件的数组元素。
let arr1 = [1,2,3,43,1,3]
let arr2 = [4,5]
let res = arr1.find(item => item>2)
console.log(res) //3
console.log(arr1)//[ 1, 2, 3, 43, 1, 3 ]
19.Array.flat() 嵌套数组转一维数组,参数是数字,表示转换几维数组,参数为Infinity时,无论多少维数组都转为一维数组。
var arr = [1,2,[3,4],[5,6,[7,8]]];
var newArr1 = arr.flat(2);
var newArr2 = arr.flat(Infinity);
console.log(newArr1); // [1,2,3,4,5,6,[7,8]]
console.log(newArr2); // [1,2,3,4,5,6,7,8]
20.**Array.map()**方法,遍历数组中的每一项并操作,同时返回一个新的数组。原数组不变。(类似forEach)。
var arr = [1,2,3,4,5];
var newArr = arr.map(v => v*2);
console.log(newArr); // [2,4,6,8,10]
console.log(arr); // [ 1, 2, 3, 4, 5 ]
21.Array.forEach(),和for方法一样,遍历数组中的每一个元素,并将元素值和索引传进回调函数。原数组不变。
var arr = [1,2,3,4,5];
arr.forEach((v) => {
console.log(v); // 1 2 3 4 5
});
ES6新增了两个方法
批量复制方法copyWithin(),以及填充数组方法fill()。
这两个方法的函数比较类似,都需要指定既有数组实例上的一个范围,包含开始索引,不包含结束索引,使用这个方法不会改变数组的大小。
1.Array.fill(),使用fill()方法可以向一个已有的数组中插入全部或部分相同的值。开始索引用于指定开始填充的位置,它是可选的。如果不提供结束索引,则一直填充到数组末尾。负值索引从数组末尾开始计算。
(1)用1填充整个数组
const arr = [0,0,0,0,0]
arr.fill(1);
console.log(arr);//[1,1,1,1,1]
arr.fill(0);
console.log(arr);//[0,0,0,0,0]//重置为0
(2)用2填充索引大于等于2的元素
const arr = [0,0,0,0,0]
arr.fill(2,3);
console.log(arr);//[ 0, 0, 0, 2, 2 ]
arr.fill(0);
console.log(arr);//[0,0,0,0,0]//重置为0
(3)使用3填充索引大于等于1且小于3的元素
const arr = [0,0,0,0,0]
arr.fill(3,1,3);
console.log(arr);//[ 0, 3, 3, 0, 0 ]
(4)用4填充索引大于等于1且小于4的元素
const arr = [0,0,0,0,0]
arr.fill(4,1,4);
console.log(arr);//[ 0, 4, 4, 4, 0 ]
注意:fill()会自动忽略超出数组边界、零长度及方向相反的索引范围。
2.Array.copyWithin(),copyWithin()会按照指定范围浅复制数组中的部分内容,然后将他们插入到指定索引开始的位置。
(1)从arr中复制索引5开始的内容,插入到索引0开始的位置
let arr =[0,1,2,3,4,5,6,7,8,9]
arr.copyWithin(0,2);
console.log(arr);//[2, 3, 4, 5, 6,7, 8, 9, 8, 9]
(2)从arr中复制索引0开始到索引3结束的内容,插入到索引4开始的地方
let arr =[0,1,2,3,4,5,6,7,8,9]
arr.copyWithin(4,0);
console.log(arr);//[0,1,2,3,0,1,2,3,4,5]
arr.copyWithin(2,0,2);
console.log(arr);//[0,1,0,1,0,1,2,3,4,5]
原文链接:https://blog.csdn.net/LiXiu_zhe/article/details/120285176
版权声明
本文为[凌儿~]所创,转载请带上原文链接,感谢
https://blog.csdn.net/rhcjqmm666/article/details/124255008
边栏推荐
猜你喜欢

Upload labs range practice

Intranet penetration series: dns2tcp of Intranet tunnel

DVWA靶场练习

Buctf MISC brossage

Intranet penetration series: pingtunnel of Intranet tunnel

Cloud computing skills competition -- Part 2 of openstack private cloud environment

feign如何集成hystrix

Intranet penetration series: ICMP of Intranet tunnel_ Tran

Intranet penetration series: dnscat2 of Intranet tunnel

Analysis of Nacos source code
随机推荐
編譯原理題-帶答案
Research on system and software security (I)
Smart business card applet business card details page function implementation key code
Redis -- why is the string length of string emstr the upper limit of 44 bytes?
How to import Excel data in SQL server, 2019 Edition
MySQL——第一章节(MySQL中的数据类型)
[problem solving] vs2019 solves the problem that the EXE file generated by compilation cannot be opened
BUFFCTF文件中的秘密1
Interview learning route
The whole house intelligence bet by the giant is driving the "self revolution" of Hisense, Huawei and Xiaomi
Cloud computing skills competition -- the first part of openstack private cloud environment
国基北盛-openstack-容器云-环境搭建
feign如何集成hystrix
Brief description of CPU
Discussion on ES6 tail tune optimization
upload-labs 靶场练习
[programming practice / embedded competition] learning record of embedded competition (I): establishment of TCP server and web interface
数据库之MySQL——基本常用查询命令
How does feign integrate hystrix
渗透测试面试合集---HVV---