js数组方法大全(下)


记录一下整理的js数组方法,免得每次要找方法都找不到。图片有点多,注意流量,嘻嘻!

本期分享

  • forEach()
  • map()
  • filer()
  • every()
  • some()
  • reduce()
  • reduceRight()
  • indexOf()
  • lastIndex()

上期分享

  • join()
  • reverse()
  • sort()
  • concat()
  • slice()
  • splice()
  • push()
  • pop()
  • unshift()
  • shift()
  • toString()
  • toLocaleString()

forEach() --->遍历

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:无
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:该方法无法提前终止运行,如果要提前终止运行,只能使用try块中,然后抛出一个异常。
  • 小技巧:如果数组是个数组对象形式可以直接操作数组元素改变原始数组本身,因为对象是个引用数据类型嘛!
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var sum =0;
data.forEach(value=>{
sum+=value;
})
log(sum); data.forEach((v,i,a)=>{
a[i]=v+1;
})
log(data); var data_post=[{a:1},{a:2}]
data_post.forEach(value=>{
value.a++;
})
log(data_post)

map() --->映射

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:返回一个新函数
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:传递给map函数应该有返回值,返回值是新数组的元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.map(x=>{
return x*x;
})
log(b)

filter() --->过滤

  • 使用热度:常用
  • 是否改变原始数组:否
  • 返回:返回过滤后的数组
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:如果返回值是true或者可以转化为true的值,那么这个值就是新数组的元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.filter(x=>{
return x<3;
})
log(b)

every() --->检测

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:true或者false
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:当且仅当针对数组中的所有元素调用绑定函数都返回true时,它才返回true。
  • 注意:一旦every或者some已经确定了改返回什么值得时候就不会遍历数组了。根据数学上的惯例,在空数组调用时,every返回true,some返回false。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.every(x=>{
return x<10;
})
log(b) var c= data.every(x=>{
return x%2===0;
})
log(c)

some() --->检测

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:true或者false
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:当数组中至少有一个元素调用绑定函数返回true时,它就返回true。
  • 注意:一旦every或者some已经确定了改返回什么值得时候就不会遍历数组了。根据数学上的惯例,在空数组调用时,every返回true,some返回false。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.some(x=>{
return x>10;
})
log(b) var c= data.some(x=>{
return x%2===0;
})
log(c)

reduce() --->简化

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:返回一个值
  • 参数:
参数位置 参数类型 是否必选 作用
1 function 四个参数分别是:初始化值/数组元素、数组元素、元素的索引、数组本身
2 number 供计算的初始化值
  • 说明:第一个参数是到目前为止的简化操作累计的结果
  • 注意:如果没有初始化值,第一次调用函数的第一个参数就是第一个数组元素,第二个参数则是第二个数组元素。如果有初始化值,第一次调用函数的第一个参数就是初始化值,二个参数则是第一个数组元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.reduce((x,y)=>{
return x+y;
},0)
log(b) var c= data.reduce((x,y)=>{
return x*y;
},1)
log(c) var d= data.reduce((x,y)=>{
return x>y?x:y;
},1)
log(d)

reduceRight() --->简化

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:返回一个值
  • 参数:
参数位置 参数类型 是否必选 作用
1 function 四个参数分别是:初始化值/数组元素、数组元素、元素的索引、数组本身
2 number 供计算的初始化值
  • 说明:第一个参数是到目前为止的简化操作累计的结果。不同于reduce这个仅仅是从右到左计算。
  • 注意:如果没有初始化值,第一次调用函数的第一个参数就是第一个数组元素,第二个参数则是第二个数组元素。如果有初始化值,第一次调用函数的第一个参数就是初始化值,二个参数则是第一个数组元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
data.reduceRight((x,y)=>{
log(y)
return x+y;
},0)

indexOf() --->搜索

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:返回数组索引或者-1
  • 参数:
参数位置 参数类型 是否必选 作用
1 * 要搜索的数组元素
2 number 从数组哪个索引开始搜索
  • 说明:如果能搜索到结果将返回第一个索引,如果搜索不到就返回-1
  • 注意:如果第二个参数是负数,指的是从数组元素末尾的偏移量位置开始向后搜索,而不是到偏移量位置就截止搜索了,这里是很容易和splice弄混的。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b=data.indexOf(1,-5);
log(b);

lastIndexOf() --->搜索

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:返回数组索引或者-1
  • 参数:
参数位置 参数类型 是否必选 作用
1 * 要搜索的数组元素
2 number 从数组哪个索引开始搜索
  • 说明:和indexOf不同的是lashIndexOf是反向搜索
  • 注意:因为是反向搜索,当第二个参数是负数的时候,就是指从末尾偏移量的位置向前搜索
  • 实例如下:
var log=console.log;
var data=[1,2,3,2,5];
var b=data.lastIndexOf(2,-3)
log(b) var c=data.lastIndexOf(1,-5)
log(c)

js数组方法大全(下)的更多相关文章

  1. 转载收藏(js数组方法大全)

    js数组方法大全 JavaScript中创建数组有两种方式 (一)使用 Array 构造函数: var arr1 = new Array(); //创建一个空数组var arr2 = new Arra ...

  2. js数组方法大全(上)

    # js数组方法大全(上) 记录一下整理的js数组方法,免得每次要找方法都找不到.图片有点多,注意流量,嘻嘻! 本期分享 join() reverse() sort() concat() slice( ...

  3. js数组方法大全

    JavaScript中创建数组有两种方式 (一)使用 Array 构造函数: var arr1 = new Array(); //创建一个空数组var arr2 = new Array(20); // ...

  4. js中数组方法大全

    js数组方法大全 一:前言 我们在学到js中数组的时候,我们会接触到js中数组的一些方法,这些方法对我们来说,可以很遍历的达到我们想要的结果,但是因为方法比较多,有些方法也不常用,可能会过一段时间就会 ...

  5. JavaScript数组方法大全(推荐)

    原网址:http://www.jb51.net/article/87930.htm 数组在笔试中经常会出现的面试题,javascript中的数组与其他语言中的数组有些不同,为了方便之后数组的方法学习, ...

  6. 一站式超全JavaScript数组方法大全

    一站式JavaScript数组方法大全(建议收藏) 方法一览表 详细操作 本人总结了JavaScript中有关数组的几乎所有方法(包含ES6之后新增的),并逐一用代码进行演示使用,希望可以帮助大家! ...

  7. js 数组方法比较

    js 数组方法比较 table th:first-of-type { width: 80px; } table th:nth-of-type(2) { width: 120px; } table th ...

  8. js数组方法详解

    Array对象的方法-25个 /*js数组方法详解 */ /* * 1 concat() 用于连接多个数组或者值-------------- * 2 copyWithin() 方法用于从数组的指定位置 ...

  9. JavaScript数组方法大全(第二篇)

    数组方法大全(第二篇) 注意:如有错误欢迎指出,如有雷同纯属巧合,本博客参考书籍JavaScript权威指南,有兴趣的小伙伴可以去翻阅一下哦 forEach()方法 遍历数组,里面可以传递一个方法 v ...

随机推荐

  1. 调用对象 “ha-datastoresystem”的“HostDatastoreSystem.QueryVmfsDatastoreCreateOptions” 失败。

    VMware vSphere Client上显示:在 ESXi“10.10.10.3”上调用对象 “ha-datastoresystem”的“HostDatastoreSystem.QueryVmfs ...

  2. Python_深拷贝和浅拷贝

    深拷贝与浅拷贝 import copy v = 123 v1 = copy.copy(v) #浅拷贝 v2 = copy.deepcopy(v) #深拷贝 **拷贝只拷贝可变数据类型,浅拷贝只拷贝第一 ...

  3. vue css 深度选择器

    在我们想穿透的选择器前边添加 >>> 或者 /deep/ 或者 ::v-deep. 官方地址:https://vue-loader.vuejs.org/guide/scoped-cs ...

  4. JS实现生成一个周对应日期数组

    /* 获取日期和周 */ getDateWeek() {/* 得到当前日期的时间戳 */ const timestamp = Date.now() // const timestamp = new D ...

  5. python编程系列---进程池的优越性体验

    1.通过multiprocessing.Process()类创建子进程 import multiprocessing, time, os, random def work(index): " ...

  6. Mysql高手系列 - 第27篇:mysql如何确保数据不丢失的?我们借鉴这种设计思想实现热点账户高并发设计及跨库转账问题

    Mysql系列的目标是:通过这个系列从入门到全面掌握一个高级开发所需要的全部技能. 欢迎大家加我微信itsoku一起交流java.算法.数据库相关技术. 这是Mysql系列第27篇. 本篇文章我们先来 ...

  7. Java基础(七)泛型数组列表ArrayList与枚举类Enum

    一.泛型数组列表ArrayList 1.在Java中,ArrayList类可以解决运行时动态更改数组的问题.ArrayList使用起来有点像数组,但是在添加或删除元素时,具有自动调节数组容量的功能,而 ...

  8. Unity C#数据持久化与xml

    最近工作需要用到数据持久化,所以在此分享一下,通过查阅资料,数据持久化大体都是通过xml或者json来进行的.unity为我们自定义了数据持久化方法,但是比较局限,还需要自己来完成数据持久化方法. ( ...

  9. AS报错:lambda expressions are not supported at this language level

    AS报错:lambda expressions are not supported at this language level 解决方法 打开打开 File --> Project Stuct ...

  10. 小白 Python 爬虫部署 Linux

    前言 前面国庆节的时候写过一个简易的爬虫. <Python 简易爬虫实战> 还没看过的同学可以先看一下,这只爬虫主要用来爬取各个博客平台的阅读量等数据,一直以来都是每天晚上我自己手动在本地 ...