首页 > 其他分享 >js数组循环常用的几种方法

js数组循环常用的几种方法

时间:2024-03-17 20:03:44浏览次数:49  
标签:arr console 几种 item 循环 数组 var js

前端开发中,经常要用到循环,保存一份,后面慢慢补充。
js数组循环常用的几种方法:。
1、for循环
最基本的循环方式,也是速度比较快,效率比较高的循环方式,

var arr = [1,2,3,4,5];
for (var i = 0; i < arr.length; i++) {
	console.log(arr[i]);
}

2、forEach循环
历数组中的每一项,没有返回值,对原数组没有影响,不支持IE,break无法跳出循环,retrun只能跳出当前循环,无法终止循环。

var arr = [1,2,3,4,5];
arr.forEach(function (item, index, array) {
	// item数组中的当前项, index当前项的索引, array原始数组;
	console.log(item);
})

3、map循环
有返回值,支持return返回值,把每一次循环return返回的值组成一个新的数组,对原数组没有影响。

var arr = [1,2,3,4,5];
var newArr = arr.map(function (item, index, array) {
	return item * 10;
})
console.log(arr); // [1,2,3,4,5]
console.log(newArr); // [10,20,30,40,50]

4、for of循环
ES6新增的循环方法,没有索引,它可以正确响应break、continue和return语句,而且,这个方法避开了for-in循环的所有缺陷。for-in循环虽然可以循环数组,但是会有好多坑,它主要用于循环对象,今天我总结的是数组的循环,就把for-in排除在外了。

var arr = [1,2,3,4,5];
for (var item of arr) {
	// item指的的就是数组每一项的值
	console.log(item);
}

5、filter循环
返回新数组,不会改变原数组,新数组由符合条件的数组组成。

var arr = [1,2,3,4,5];
var newArr = arr.filter(function (item) {
	return item > 3;
})
console.log(arr); // [1,2,3,4,5]
console.log(newArr); // [4,5]

6、every循环
给数组每一项都运行一个函数,如果每一项都符合条件,就返回true,否则返回false。

var arr = [1,2,3,4,5];
var result1 = arr.every(function (item, index, array) {
	return item > 3;
});
var result2 = arr.every(function (item, index, array) {
	return item > 0;
})
console.log(result1); // false
console.log(result2); // true

7、some循环
给数组每一项都运行一个函数,同every相反,只要有一项符合条件,就跳出循环,返回true,否则返回false。

var arr = [1,2,3,4,5];
var result1 = arr.some(function (item, index, array) {
	return item > 4;
});
var result2 = arr.some(function (item, index, array) {
	return item > 5;
})
console.log(result1); // true
console.log(result2); // false

8、find循环
给数组每一项都运行一个函数,只要有一项符合条件,就跳出循环,返回第一个符合条件的元素,否则返回undefined。

var arr = [1,2,3,4,5];
var result1 = arr.find(function (item) {
	return item > 3;
});
console.log(result1); // 4

还有其他的方法,欢迎大家补充。

标签:arr,console,几种,item,循环,数组,var,js
From: https://blog.csdn.net/zhangtaoxgu/article/details/136744900

相关文章

  • js面试(节流)
    一、节流在JavaScript中,节流(throttle)是一种常用的性能优化技术,用于限制某个函数在一定时间内的执行频率。具体来说,节流函数允许你在一段时间内只执行一次回调函数,即使在这段时间内触发了多次事件。这有助于防止因为频繁触发事件而导致的性能问题。节流的实现原理是,在事件被触发......
  • Vue.js前端开发零基础教学(一)
    目录第一章 初识Vue.js前言 开发的好处一.前端技术的发展什么是单页Web应用?二.Vue的简介三.Vue的特性四.Vue的版本五.常见的包管理六.安装node环境第一章 初识Vue.js学习目标:了解前端技术的发展了解什么是Vue掌握使用方法掌握Node.js环境的搭建前言......
  • 数组基础使用
    关于数组①数组定义之后大小不能改变②数组内元素数据类型相通不允许出现不同类型③数组内的元素可以是任何数据类型包括基本数据类型和引用数据类型④数组变量属于引用类型,数组也可以看做是对象,数组的每个元素的相当于这个对象的成员变量⑤数组本身是对象Java中对象是在......
  • js实现交通灯(两种方案)
    简介刚在抖音上刷到一个面试题,说实现交通灯的方案,我一开始想到的是通过定时器去实现,没想到他提到了一个问询的方式去实现,借此记录下来,本文介绍了两种方案去实现交通灯以及对应的倒计时。废话不多说,上代码html+csshtml代码如下:<!DOCTYPEhtml><htmllang="en"><head><......
  • 视野修炼-技术周刊第77期 | JSR 的愿景
    欢迎来到第77期的【视野修炼-技术周刊】,下面是本期的精选内容简介......
  • Java创建数组、赋值的四种方式,声明+创建+初始化 详解
    @目录一、创建数组的四种方式二、详解三、数组存储的弊端一、创建数组的四种方式以int数据类型为例@TestpublicvoidtestNewArray(){//创建数组//法一int[]arr1=newint[]{1,2,3,4,5};System.out.println(arr1.length+""+arr1[2]);//5......
  • [nodejs] NodeJs/NPM入门教程
    0序nodejs是运行在服务器端的js,常用于前端工程师在本地电脑、或生产环境部署调试或运行前端工程。回想起来,上次使用nodejs,还在5年前做大学毕业设计时,基于前后端分离的实践(那时,业界正在兴起前后端分离的浪潮。当然了,现在的web工程,前后端分离已是默认的技术选择了)这次重......
  • 代码随想录 第23天 | 669. 修剪二叉搜索树 ● 108.将有序数组转换为二叉搜索树 ● 5
    leetcode:669.修剪二叉搜索树-力扣(LeetCode)classSolution{publicTreeNodetrimBST(TreeNoderoot,intlow,inthigh){//和删除差不多,怕删除的节点的左右孩子节点有符合范围的,所以要每次判断一下,如果有不符合要求的就直接返回上一个节点。if(roo......
  • C语言指针与数组(不适合初学者版):一篇文章带你深入了解指针与数组!
    ......
  • C语言指针(适合C语言进阶者):一道题带你深入理解数组与指针的关系
    ......