广告
返回顶部
首页 > 资讯 > 前端开发 > html >JavaScript常用的数组方法有哪些
  • 494
分享到

JavaScript常用的数组方法有哪些

2024-04-02 19:04:59 494人浏览 薄情痞子
摘要

这篇文章主要讲解了“javascript常用的数组方法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript常用的数组方法有哪些”吧!不会

这篇文章主要讲解了“javascript常用的数组方法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript常用的数组方法有哪些”吧!

JavaScript常用的数组方法有哪些

不会改变原数组的方法

forEach()方法

forEach()方法传入的参数是一个函数,内部传入的函数的形参第一个是item数组每一项的值,第二个是索引号index,它的返回值是undefined;
运行实例如下:
JavaScript常用的数组方法有哪些
控制台输出结果
JavaScript常用的数组方法有哪些

filter()方法

filter()方法是筛选数组的方法,传入的参数和forEach方法一样,但是返回值为一个数组,实际应用是用来将获取到的数据中符合条件的数组筛选出来;
运行的实例如下:
JavaScript常用的数组方法有哪些
控制台输出结果如下:
JavaScript常用的数组方法有哪些

map()方法

map()方法传入的参数也同上,它的返回值也是一个新的数组;map()方法可以对数组的每一项进行相同的处理,运行的实例如下:
JavaScript常用的数组方法有哪些

控制台的输出结果:
JavaScript常用的数组方法有哪些

findIndex()方法

findIndex()方法顾名思义,是返回数组中的符合条件的第一项的索引号,如果找不到返回-1。传入的参数同上,运行实例如下所示:

let arr = [1, 3, 3, 4, 5, 6, 7]
//findIndex方法,返回第一个符合条件哪一项的索引号,找不到返回-1
const res = arr.findIndex((item) => item > 5)
console.log(res)

控制台输出结果:
JavaScript常用的数组方法有哪些

find()方法

find()方法是返回查找到的第一个符合条件的那一项,传入的参数同上。运行实例如下所示:

let arr = [1, 3, 3, 4, 5, 6, 7]
//find()查找item,返回第一个符合条件的那一项,找不带返回undefined
const res2 = arr.find((item) => {
  return item > 5
})
console.log(res2)

控制台运行结果如下:
JavaScript常用的数组方法有哪些

some()方法

some()方法传入的参数同上,返回值是布尔值,只要查找到一项符合条件就返回true;示例如下:

let arr = [1, 3, 3, 4, 5, 6, 7]
//some方法返回布尔值
const bl = arr.some((item) => {
  return item > 5
})
console.log(bl)

JavaScript常用的数组方法有哪些

every()方法

every()方法传入的参数也是同上,返回值是布尔值,但是必须每一项都符合条件才返回true;示例如下:

let arr = [1, 3, 3, 4, 5, 6, 7]
//every()返回值为布尔值需要全部通过筛选条件才返回true
const bl2 = arr.every((currentValue) => {
  return currentValue < 10
})
console.log(bl2)

JavaScript常用的数组方法有哪些

reduce()归纳函数

reduce()函数中的参数第一个参数是函数,第二个参数是暂存变量sum的类型,第一个参数函数有四个参数,不过常用的就是第一个参数为累加暂存变量(return就是这个值),第二个参数item。第三个是index,第四个是数组本身;代码示例如下:

let arr = [1, 3, 3, 4, 5, 6, 7]
//reduce()归纳函数
const previousValue = 0
const arrSum = arr.reduce((previousValue, currentValue) => {
  return previousValue + currentValue
}, 0)
console.log(arrSum)

控制台输出结果如下:
JavaScript常用的数组方法有哪些

concat()数组拼接

concat()将两个数组进行拼接,返回的是拼接完的新数组,不能给多维数组(数组套数组)进行拼接;
代码示例如下:

let arr = [1, 3, 3, 4, 5, 6, 7]
//concat 将两个数组进行拼接 , 返回的是一个新的数组
const newArr3 = [2, 5, 5, 6, 6, 8]
const concatArr = arr.concat(newArr3)
console.log(concatArr)

JavaScript常用的数组方法有哪些

改变原数组的方法

push()/unshift()

push()/unshift()方法是分别在数组的最后面和最前面添加一个元素,返回值是新数组的长度;

//一下数组处理方法会改变原数组
const Arr = [1, 3, 5, 6, 7, 8, 9]
Arr.push(1)
console.log(Arr)
console.log(Arr)
const a = Arr.unshift(1)
console.log(a)

控制台输出结果如下:
JavaScript常用的数组方法有哪些

pop()/shift()

此两种方法pop()是删除数组的最后一个值,shift()是删除数组的第一项的值;返回值是删除的那一项;

arr.pop(1)
console.log(arr)
arr.shift(1)
console.log(arr)

控制台输出结果如下:
JavaScript常用的数组方法有哪些

sort()/reverse()

sort()方法是排序,内部的参数是一个函数,function(a , b){ return a - b },通过此函数可以控制排序是降序函数升序,如果参数内部return a - b是降序,return a + b是升序;
reverse()是数组翻转,即将数组的元素倒序排列;代码示例如下:

let arr = [1, 3, 3, 4, 5, 6, 7]arr.sort((a, b) => {
  return a - b})console.log(arr)arr.reverse()console.log(arr)

JavaScript常用的数组方法有哪些

splice()

splice()方法修改原数组,返回一个删除元素的新数组,负数就是从后往前数索引;传入的第一个参数是删除的起始元素的索引号,第二个参数是删除的元素的个数;

let arr = [1, 3, 3, 4, 5, 6, 7]arr.splice(1, 3)console.log(arr)

JavaScript常用的数组方法有哪些

其它

flat()

flat()用于多维数组拍平,传入的参数是数组拍平的深度,也可以是infiniy,代表数组拍平的深度是无穷大
代码示例如下:

const Arr2 = [
  [1, 2],
  [2, 3],
  [4, 5],
  [5, 6],]console.log(Arr2.flat(Infinity))

控制台输出结果:
JavaScript常用的数组方法有哪些

fill()

可以对数组进行填充:写法:Array.fill(1 , 2 , 4)数组中填充1 , 从索引值是2的元素开始, 到元素的索引号是4开始,不包括索引值是4的元素;填充的元素会覆盖原来对应索引号的元素;
代码示例如下:

const Arr2 = [
  [1, 2],
  [2, 3],
  [4, 5],
  [5, 6],]console.log(Arr2.fill(1, 0, 4))

控制台输出结果:
JavaScript常用的数组方法有哪些

感谢各位的阅读,以上就是“JavaScript常用的数组方法有哪些”的内容了,经过本文的学习后,相信大家对JavaScript常用的数组方法有哪些这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

--结束END--

本文标题: JavaScript常用的数组方法有哪些

本文链接: https://www.lsjlt.com/news/97988.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 常用的JavaScript数组方法有哪些
    常用的JavaScript数组方法有:1. push():将一个或多个元素添加到数组的末尾,并返回新数组的长度。2. pop():删...
    99+
    2023-10-12
    JavaScript
  • JavaScript常用的数组方法有哪些
    这篇文章主要讲解了“JavaScript常用的数组方法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript常用的数组方法有哪些”吧!不会...
    99+
    2022-10-19
  • JavaScript数组常用的方法有哪些
    这篇文章主要介绍“JavaScript数组常用的方法有哪些”,在日常操作中,相信很多人在JavaScript数组常用的方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”...
    99+
    2022-10-19
  • JavaScript数组有哪些常用方法
    这篇文章主要介绍了JavaScript数组有哪些常用方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1、前言数组方法有太多了,本文记录一些本人容易记错的一些数组方法,用于巩...
    99+
    2023-06-25
  • JavaScript中数组Array的常用方法有哪些
    这篇文章主要为大家展示了“JavaScript中数组Array的常用方法有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JavaScript中数组Array的常用方法有哪些”这篇文章吧。一....
    99+
    2023-06-25
  • 常用的javascript数组操作方法有哪些
    这篇文章主要介绍“常用的javascript数组操作方法有哪些”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“常用的javascript数组操作方法有哪些”文章能帮助...
    99+
    2022-10-19
  • JavaScript数组常见使用方法有哪些
    今天小编给大家分享一下JavaScript数组常见使用方法有哪些的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。1. push...
    99+
    2023-07-04
  • javascript中常见的数组方法有哪些
    小编给大家分享一下javascript中常见的数组方法有哪些,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!javascript数组方法有:concat()、join()、pop()、push()、revers&#...
    99+
    2023-06-14
  • javascript中数组去重常用方法有哪些
    这篇文章将为大家详细讲解有关javascript中数组去重常用方法有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。具体如下:数组去除重复值是面试常考内容,也是很容易用...
    99+
    2022-10-19
  • JavaScript原生数组Array常用方法有哪些
    这篇文章给大家分享的是有关JavaScript原生数组Array常用方法有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。栈方法push方法和pop方法, 可以使数组的行为类似...
    99+
    2022-10-19
  • JavaScript数组合并的常见方法有哪些
    这篇文章主要介绍了JavaScript数组合并的常见方法有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript数组合并的常见方法有哪些文章都会有所收获,下面我们一起来看看吧。1.ES6 解构[...
    99+
    2023-07-04
  • javascript数组的方法有哪些
    javascript数组的方法有哪些,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。在日常开发中,我们会接触到js中数组的一些方法,这些方法对我们来说,可以很遍历...
    99+
    2023-06-28
  • js数组的常用方法有哪些
    这篇文章主要介绍了js数组的常用方法有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇js数组的常用方法有哪些文章都会有所收获,下面我们一起来看看吧。 数组的常用方法有下面...
    99+
    2022-10-19
  • vue常用的数组方法有哪些
    今天小编给大家分享一下vue常用的数组方法有哪些的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。1. join()join(&...
    99+
    2023-07-04
  • JavaScript中数组常用的迭代处理方法有哪些
    这篇文章主要介绍“JavaScript中数组常用的迭代处理方法有哪些”,在日常操作中,相信很多人在JavaScript中数组常用的迭代处理方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方...
    99+
    2022-10-19
  • javascript数组里的方法有哪些
    这篇文章将为大家详细讲解有关javascript数组里的方法有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。1.concat()concat() 方法用于连接两个或多个数组。方法不...
    99+
    2023-06-29
  • JavaScript数据数组方法有哪些
    JavaScript数据数组方法有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。  好程序员web前端培训分享JavaScript数据...
    99+
    2022-10-19
  • java数组中常用方法有哪些
    1. arraycopy方法原型: public static void arraycopy(sourceArray,int index1,copyArray,index2,int length)即从sourceArray的index1位置...
    99+
    2019-02-11
    java 数组 常用方法
  • JS数组Array常用方法有哪些
    这篇“JS数组Array常用方法有哪些”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“JS数组Array常用方法有哪些”文章吧...
    99+
    2023-06-30
  • JavaScript中遍历数组和对象有哪些常用的方法
    这篇文章主要介绍“JavaScript中遍历数组和对象有哪些常用的方法”,在日常操作中,相信很多人在JavaScript中遍历数组和对象有哪些常用的方法问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操...
    99+
    2022-10-19
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作