返回顶部
首页 > 资讯 > 前端开发 > node.js >es6中数组新增常用的方法有哪些
  • 192
分享到

es6中数组新增常用的方法有哪些

2024-04-02 19:04:59 192人浏览 泡泡鱼
摘要

这篇文章主要介绍“es6中数组新增常用的方法有哪些”,在日常操作中,相信很多人在es6中数组新增常用的方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”es6中数组新增

这篇文章主要介绍“es6数组新增常用的方法有哪些”,在日常操作中,相信很多人在es6中数组新增常用的方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”es6中数组新增常用的方法有哪些”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

es6中数组新增常用的4个方法是:1、forEach(),用于遍历数组,无返回值;2、filter(),过滤掉数组中不满足条件的值;3、map(),遍历数组,返回一个新数组;4、reduce(),让数组的前后两项进行某种计算,然后返回其值。

教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

ES6中新增4个很实用的数组方法,分别有:forEach,filter,map ,reduce。

1.forEach

遍历数组,无返回值,不改变原数组,仅仅只是遍历 --相当于for循环遍历

 let arr=[23,44,56,22,11,99]
   let res=arr.forEach(item=>{
     console.log(item);
     //23,44,56,22,11,99
   })
   let res2=arr.forEach((item,index)=>{
     console.log(item,index);
     //23 0
     //44 1
     //....
   })

es6中数组新增常用的方法有哪些

2.filter:

filter()函数过滤掉数组中不满足条件的值,如果回调函数返回true就留下,返回一个新数组,不改变原数组,!!!可以用来做数组去重

   let arr = [1,5,2,16,4,6]
   //1.找出数组中的偶数
   let newArr=arr.filter((v,i)=>
     v%2==0)
     console.log(newArr,'newArr');//2,16,4,6

   //2.过滤器 保留为TRUE的结果
   let arrTue=[13,14,9,33]
   let newArr2=arrTue.filter(item=>(item%3===0)?true:false)
   console.log(newArr2,'newArr2');//9,33
   //3.利用filter去重‘
 // 第一种
   let arr3=[2,3,5,1,2,3,4,5,6,8],newArr3
   function unique(arr){
    const res = new Map()
    return arr.filter((item)=>
      !res.has(item) && res.set(item,1)
    )
    }
   console.log(newArr3=unique(arr3),'newArr3');//2,3,5,1,4,6,8
//第二种
  let testArray = [
        {key:"01",name:'张三'},
        {key:"02",name:'小李'},
        {key:"03",name:'小罗'},
        {key:"04",name:'张三'},
        {key:"03",name:'小李'},
      ];
      let deduplicationAfter = testArray.filter((value,index,array)=>{
      //findIndex符合条件的数组第一个元素位置。
        return array.findIndex(item=>item.key === value.key && item.name === value.name) === index
      })
      console.log(deduplicationAfter)

es6中数组新增常用的方法有哪些

3.map :

map遍历数组,返回一个新数组,不改变原数组, 映射 一个对一个,映射到一个新数组

let arr = [6,10,12,5,8]
let result = arr.map(function (item) {
    return item*2
})
let result2 = arr.map(item=>item*2) // es6的箭头函数简写,若想了解,后面的文章有介绍
console.log(result)
console.log(result2)

let score = [18, 86, 88, 24]
let result3 = score.map(item => item >= 60 ? '及格' : '不及格')
console.log(result3)

es6中数组新增常用的方法有哪些

4.reduce:

reduce()汇总 一堆出来一个(用于比如,算个总数,算个平均),reduce让数组的前后两项进行某种计算,然后返回其值,并继续计算,不改变原数组,返回计算的最终结果,如果不给定初始值,则从数组的第二项开始遍历

arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue]) ,第一个参数回调函数,第二个参数初始值

4.1求和

//第一种给定初始值
       var arr = [1, 3, 5, 7];
        // 原理: 利用reduce特性 prev初始值设置0 并把函数的返回值再次带入函数中
        var sum = arr.reduce(function (tmp, item,index) { // prev 初始为0 以后则为函数返回的值
          console.log(tmp,item,index);
		    //  0 1  0
			//	1 3  1
			//	 4 5  2
			//	 9 7  3
            return tmp + item; // 数组各项之间的和
        }, 0);
       console.log(sum); //16
   //第二种不给初始值
   var arr2 = [1, 3, 5, 7]
	var result = arr2.reduce(function (tmp, item, index) {
	    //tmp 上次结果,item当前数,index次数1开始
	    console.log(tmp, item, index)
	        //1 3 1 
		   // 4 5 2 
		   // 9 7 3 
	    return tmp + item;
	})
console.log(result,)   //16

4.2 求平均数

var arr = [1, 3, 5, 7]
var result = arr.reduce(function (tmp, item, index) {
  console.log(tmp,item,index);
  // 1 3  1
 //  4 5  2
 //  9 7  3
    if (index != arr.length - 1) { // 不是最后一次
        return tmp + item
    } else {
        return (tmp + item)/arr.length
    }
})
console.log(result,'[[[u99')  // 平均值  4

到此,关于“es6中数组新增常用的方法有哪些”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

--结束END--

本文标题: es6中数组新增常用的方法有哪些

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

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

猜你喜欢
  • es6中数组新增常用的方法有哪些
    这篇文章主要介绍“es6中数组新增常用的方法有哪些”,在日常操作中,相信很多人在es6中数组新增常用的方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”es6中数组新增...
    99+
    2024-04-02
  • ES6中数组新增的方法有哪些
    小编给大家分享一下ES6中数组新增的方法有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在ES6之前,创建数组的方式有2种:一: 通过数组字面量let&nbs...
    99+
    2023-06-29
  • es6新增的数组方法有哪些
    这篇文章主要介绍“es6新增的数组方法有哪些”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“es6新增的数组方法有哪些”文章能帮助大家解决问题。 ...
    99+
    2024-04-02
  • JavaScript es6的新增数组方法有哪些
    这篇文章主要讲解了“JavaScript es6的新增数组方法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript es6的新增数组方法有哪些”吧!1...
    99+
    2023-06-21
  • ES6数组新增方法知识点有哪些
    这篇文章主要介绍“ES6数组新增方法知识点有哪些”,在日常操作中,相信很多人在ES6数组新增方法知识点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”ES6数组新增方法知...
    99+
    2024-04-02
  • ES6新增的数组方法和对象有哪些
    这篇文章主要为大家展示了“ES6新增的数组方法和对象有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“ES6新增的数组方法和对象有哪些”这篇文章吧。es6新增...
    99+
    2024-04-02
  • ES6中字符串string常用的新增方法有哪些
    这篇文章主要为大家展示了“ES6中字符串string常用的新增方法有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“ES6中字符串string常用的新增方法有...
    99+
    2024-04-02
  • es6中新增的数组方法怎么使用
    本文小编为大家详细介绍“es6中新增的数组方法怎么使用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6中新增的数组方法怎么使用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。es6数组方法有:1、Array....
    99+
    2023-07-05
  • es6 number对象的新增方法有哪些
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。在 ES5 中,全局下的 isFinite () 和 isNaN () 两种方法存在类型转换,对最终的判断结果存在歧义。ES6 在 Number 对象上,...
    99+
    2022-11-22
    javascript ES6
  • es6数组方法有哪些
    es6数组方法有哪些,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。es6数组方法有:“from()”、“of()”、“copyWithin()...
    99+
    2024-04-02
  • javascript中常用的ES6方法有哪些
    这篇文章主要介绍javascript中常用的ES6方法有哪些,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!JavaScript可以做什么1.可以使网页具有交互性,例如响应用户点击,给用户提供更好的体验。2.可以处理表...
    99+
    2023-06-14
  • 关于ES6中数组新增的方法详解
    目录在ES6之前,创建数组的方式有2种:Array.find((item,indexArr,arr)=>{}) 掌握Array.findIndex((item, index, ...
    99+
    2024-04-02
  • es6中迭代数组的方法有哪些
    这篇文章主要介绍了es6中迭代数组的方法有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇es6中迭代数组的方法有哪些文章都会有所收获,下面我们一起来看看吧。迭代方法:1、map,用于根据某种规则映射数组,得...
    99+
    2023-07-04
  • es6的新增特性有哪些
    这篇文章主要介绍“es6的新增特性有哪些”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“es6的新增特性有哪些”文章能帮助大家解决问题。 ...
    99+
    2024-04-02
  • es6新增的扩展有哪些
    这篇“es6新增的扩展有哪些”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“es6新增的扩展...
    99+
    2024-04-02
  • ES6中数组array新增方法的示例分析
    小编给大家分享一下ES6中数组array新增方法的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!●find :let arr=[1,2,234,'sdf'...
    99+
    2024-04-02
  • ES6数组去重的方法有哪些
    这篇文章主要介绍“ES6数组去重的方法有哪些”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“ES6数组去重的方法有哪些”文章能帮助大家解决问题。 ...
    99+
    2024-04-02
  • es6遍历数组的方法有哪些
    ES6中遍历数组的方法有以下几种: for...of循环:通过for...of循环可以依次遍历数组中的每个元素。例如: cons...
    99+
    2023-10-26
    es6
  • es6遍历数组有哪些方法
    这篇文章主要为大家展示了“es6遍历数组有哪些方法”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“es6遍历数组有哪些方法”这篇文章吧。 ...
    99+
    2024-04-02
  • java数组中常用方法有哪些
    1. arraycopy方法原型: public static void arraycopy(sourceArray,int index1,copyArray,index2,int length)即从sourceArray的index1位置...
    99+
    2019-02-11
    java 数组 常用方法
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作