JavaScript里面9种数组遍历!
大家好,我在这里总结分享了JavaScript中的闹腾的数组循环家族。
1、大家最常用的for循环,我就不解释了;
for(let i = 0; i < 5 ; i++){
console.log(i) // 结果 0 - 4
}
2、forEach,用法其实和for循环一样;
var arr = [1,2,3,4]
arr.forEach(e =>{
console.log(e) // 结果1 -4
})
进入下面两个循环之前,先教大家一个口诀,删filter改map
3、filter,删除不符合条件的参数;必须有返回,结果只能是boolean类型,
是true就删除,false就留下;
var arr = [1,2,3,4]
let newarr = arr.filter(e =>{
return e != 2 // 判断e(arr) 不是2的才会输出
})
console.log(newarr) // 1,3,4
4、map,只修改数组里面的值,不删除参数;
var arr = [1,2,3,4]
let newarr = arr.map(e =>{
if(e == 2){ // 如果e(arr)里面的值是2,就进来执行,变成'二'
return '二'
}
return e;
})
console.log(newarr) // [1, "二", 3, 4]
5、some,有一个符合条件就返回true,否则就返回false;
var arr = [1,2,3,4]
var newarr = arr.some(e =>{
return e < 2
})
console.log(newarr) // e(arr),里面有参数小于2的,所有返回true;
6、every,l所有条件都符合才返回true,否则返回false;
var arr = [1,2,3,4]
var newarr = arr.every(e =>{
return e > 0
})
console.log(newarr) // e(arr),里面所有参数都大于0,所以返回true;
7、reduce,可用作快速求和,求阶乘,从左往右;
var arr = [1,2,3,4]
var newarr = arr.reduce((e,v) =>{
return e += v
})
console.log(newarr) //
8、reduceRight,从右往左;........
var arr = [1,2,3,4]
var newarr = arr.reduceRight((e,v) =>{
return e += v
})
console.log(newarr) //
9、for or
const arr = ['mini', 'mani', 'mo'];
for (let val of arr) {
console.log(val); // 数组值:mini mani mo
}
for (let index of arr.keys()) {
console.log(index);// 数组x下标
}
for (let item of arr.entries()) {
console.log(item); // 数组下标和值
}
如果喜欢您,大家可以关注下“前端伪大叔”公众号,将会定期为您推送前端的知识点!谢谢!

JavaScript里面9种数组遍历!的更多相关文章
- JavaScript 的 4 种数组遍历方法: for VS forEach() VS for/in VS for/of
我们有多种方法来遍历 JavaScript 的数组或者对象,而它们之间的区别非常让人疑惑.Airbnb 编码风格禁止使用 for/in 与 for/of,你知道为什么吗? 这篇文章将详细介绍以下 4 ...
- JS几种数组遍历方式总结
JS数组遍历的几种方式 JS数组遍历,基本就是for,forin,foreach,forof,map等等一些方法,以下介绍几种本文分析用到的数组遍历方式以及进行性能分析对比 第一种:普通for循环 代 ...
- JS几种数组遍历方式以及性能分析对比
前言 这一篇与上一篇 JS几种变量交换方式以及性能分析对比 属于同一个系列,本文继续分析JS中几种常用的数组遍历方式以及各自的性能对比 起由 在上一次分析了JS几种常用变量交换方式以及各自性能后,觉得 ...
- js几种数组遍历方法.
第一种:普通的for循环 ; i < arr.length; i++) { } 这是最简单的一种遍历方法,也是使用的最多的一种,但是还能优化. 第二种:优化版for循环 ,len=arr.len ...
- Effective JavaScript Item 49 对于数组遍历,优先使用for循环,而不是for..in循环
本系列作为Effective JavaScript的读书笔记. 对于以下这段代码,能看出最后的平均数是多少吗? var scores = [98, 74, 85, 77, 93, 100, 89]; ...
- javascript数组遍历的几种常用方法性能分析对比
前言: 数组遍历有很多种方法,虽然不同方法有不同的特性及适用环境,除了普通飞for循环之外,for...in能直接输出数组元素的索引,for...of能直接输出数组元素的值,map则可以直接生成新的数 ...
- JavaScript 中的12种循环遍历方法
原文:JavaScript 中的12种循环遍历方法 题目:请介绍 JavaScript 中有哪些循环和遍历的方法,说说它们的应用场景和优缺点? 1.for 循环 let arr = [1,2,3];f ...
- javascript中常见的几种循环遍历
项目开发中,不管是建立在哪个框架基础上,对数据的处理都是必须的,而处理数据离不开各种遍历循环.javascript中循环遍历有很多种方式,记录下几种常见的js循环遍历. 一.for循环 for循环应该 ...
- 浅谈6种JS数组遍历方法的区别
本篇文章给大家介绍一下6种JS数组遍历方法:for.foreach.for in.for of.. each. ().each的区别.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. ...
随机推荐
- Laravel 中如何区别 Model 或者是 Builder?
User::where('id',1)->update([]) 和 User::find(1)->update([]) 有异曲同工之效. 额? 当你通过 Laravel 与数据库交 ...
- Jmeter之Cookie和Session处理
Jmeter之Cookie和Session处理 1.Cookie 添加方式:线程组-配置元件-HTTP Cookie 管理器,如下图: 2.Session 添加方式:线程组-前置处理器 -HTTP U ...
- pyqt5-实时刷新页面(QApplication.processEvents())
对于执行很耗时的程序来说,由于PyQt需要等待程序执行完毕才能进行下一步,这个过程表现在界面上就是卡顿,而如果需要执行这个耗时程序时不断的刷新界面.那么就可以使用QApplication.proces ...
- 使用 joblib 对 Pandas 数据进行并行处理
使用 joblib 对 Pandas 数据进行并行处理 如果需要对一个很大的数据集进行操作,而基于一列数据生成新的一列数据可能都需要耗费很长时间. 于是可以使用 joblib 进行并行处理. 假设我们 ...
- spring-boot集成4:集成mybatis,druid和tk.mybatis
Why mybatis? mybatis提供了ORM功能,相比于其他ORM框架,其需要编写更多的sql,也给了我们编写特殊/复杂sql和进行sql优化的机会. Why druid? Druid是阿里巴 ...
- Cocos2d-x入门之旅
Cocos通过动作(Action)让精灵动起来,把数个动作组成序列(Sequence)就能让精灵做出连续的动作,在动作中我们可以改变精灵的位置,旋转角度,缩放比例,等等 动作(Action)# 首先我 ...
- Docker在windows环境下的安装部署
一.准备 系统环境:Windows 10 64bit Docker安装包:Docker for Windows Installer.exe 二.安装步骤 1.开启系统的hyper-v 2. 重启电脑后 ...
- 怎么在 localhost 下访问多个 Laravel 项目,通过一个IP访问多个项目(不仅仅是改变端口哦)
server { listen 80; server_name blog.sweetsunnyflower.com; index index.html index.htm index.php; cha ...
- JavaScript Cookie常用设置
cookie是一种早期的客户端存储机制,起初是针对服务器端脚本设计使用的,只适合存储少量文本数据.从最底层来看,作为HTTP协议的一种扩展实现它.cookie数据会自动在Web浏览器和Web服务器之间 ...
- Unity中的动画系统和Timeline(2) 按钮动画和2D精灵动画
按钮动画 1 创建按钮后,按钮的Button组件中,Transition我们平时用的时Tint,这次选择Animation 选择Auto Generate Animation,创建一个按钮动画 2 后 ...