-
js数组循环遍历数组内所有元素的方法
2021-01-19 19:08:28例,for(){}遍历数组 代码如下:[removed] <...i [removed]例,for in循环遍历数组 代码如下:<html><body>[removed]var xvar mycars = new Array()mycars[0] = “Saab”mycars[1] = “Volvo”mycar -
js for循环 遍历数组 遍历对象属性
2018-03-19 23:17:451、js for循环 遍历对象属性var person = {fname:"John",lname:"...}控制台输出结果:fname=Johnlname=Doeage=252、js for循环 遍历数组var mycars = new Array("Saab","...1、js for循环 遍历对象属性
var person = {fname:"John",lname:"Doe",age:25};
for (x in person) {
console.log(x + "=" + person[x]);
}控制台输出结果:
fname=John
lname=Doe
age=252、js for循环 遍历数组
var mycars = new Array("Saab","Volvo","BMW");
for (x in mycars){
console.log(x + "=" + mycars[x])
}控制台输出结果:
0=Saab
1=Volvo
2=BMW -
js循环遍历数组(对象)
2020-08-03 21:50:34js循环遍历数组(对象) 1,for循环 对于循环应该是最常用的一种遍历方式了,通常用来遍历数组结构。 let arr = ['a','b','c']; for (let i=0; i<arr.length; i++){ console.log(i,arr[i]); } //输出 //0 a //1 ...js循环遍历数组(对象)
1,for循环
对于循环应该是最常用的一种遍历方式了,通常用来遍历数组结构。
let arr = ['a','b','c']; for (let i=0; i<arr.length; i++){ console.log(i,arr[i]); } //输出 //0 a //1 b //2 c
2,forEach循环
forEach方法用于调用数组的每个元素,并将元素传递给回调函数。对于空数组不会执行回调函数。
let arr = [1,2,3]; arr.forEach(function(i,index){ console.log(i,index) }) //输出 // 1 0 // 2 1 // 3 2
3,map方法
map返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
let arr = [1,2,3]; let newArr = arr.map(function(i){ console.log(i) // 1 2 3 return i*2; }) console.log(arr) //[1,2,3] console.log(newArr) //[2,4,6]
4,for…in循环
for…in语句用于对数组或者对象的属性进行循环操作。
for…in循环中的代码每执行一次,就会对数组或者对象的属性进行一次操作。
//遍历对象时,拿到的是键名,不能直接获取键值。 let obj={name:'programmer',age:'22',height:'180'}; for(let key in obj){ console.log(key,obj[key]) } //输出 //name programmer //age 22 //height 180 //可以直接修改原对象 for(let key in obj){ obj[key] = key } console.log(obj) //{name: "name", age: "age", height: "height"}
//遍历数组时,拿到的是下标 let arr = ['a','b','c']; for (let index in arr){ console.log(index,arr[index]); } //输出 //0 a //1 b //2 c //可以直接修改原数组 for(let index in arr){ arr[index] = index } console.log(arr) // ["0", "1", "2"]
5,for…of循环
因为是es6引入到新特性中的,借鉴c ++,java,c#和python语言,引入for…of循环,作为遍历所有数据结构的统一方法。
var arr = ['a', 'b', 'c', 'd']; for (let item of arr) { console.log(item); // a b c d } //在遍历JSON时,我自己跟喜欢用for...of,因为可以直接操作item var arr = [{a:1,b:2},{a:3,b:4}]; for (let item of arr) { item.a = 999 } console.log(arr) //[{a:999,b:2},{a:999,b:4}]
6,while循环
while用于循环作用基本一致,通常用来循环数组
let cars=["BMW","Volvo","Saab","Ford"]; let i=0; while (cars[i]){ //()里面是判断条件 console.log(cars[i]) // BMW Volvo Saab Ford i++; };
7,do while循环
do while 是while的一个亲戚,它在循环开始前先执行一次操作,然后才进行判断,true就继续执行,false就结束循环。
let i = 3; do{ console.log(i) // 3 2 1 i--; } while(i>0);
第一回创作,在学习的道路上,记录一下我学到的小知识,要是有错误,请各位及时指正,万分感谢,要是有所不足,也请指出,我也会继续添加。
遇到的难题,我也想学习到了,能总结、并且记录下来,好记性不如烂笔头,一只小菜鸟,以此篇开始记录我的成长之路
-
js循环遍历数组
2019-12-13 15:57:531.for循环 使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显。 1 2 3 for(j = 0,len=arr.length; j < len; j++) { } 2....1.for循环
使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显。
1
2
3
for
(j = 0,len=arr.length; j < len; j++) {
}
2.foreach循环
遍历数组中的每一项,没有返回值,对原数组没有影响,不支持IE
1
2
3
4
5
6
//1 没有返回值
arr.forEach((item,index,array)=>{
//执行代码
})
//参数:value数组中的当前项, index当前项的索引, array原始数组;
//数组中有几项,那么传递进去的匿名回调函数就需要执行几次;
3.map循环
有返回值,可以return出来
map的回调函数中支持return返回值;return的是啥,相当于把数组中的这一项变为啥(并不影响原来的数组,只是相当于把原数组克隆一份,把克隆的这一份的数组中的对应项改变了);
1
2
3
4
5
6
7
arr.map(
function
(value,index,array){
//do something
return
XXX
})
1
2
3
4
5
6
var
ary = [12,23,24,42,1];
var
res = ary.map(
function
(item,index,ary ) {
return
item*10;
})
console.log(res);
//-->[120,230,240,420,10]; 原数组拷贝了一份,并进行了修改
console.log(ary);
//-->[12,23,24,42,1]; 原数组并未发生变化
4.forof遍历
可以正确响应break、continue和return语句
1
2
3
for
(
var
value of myArray) {
console.log(value);
}
5.filter遍历
不会改变原始数组,返回新数组
1
2
3
4
5
var
arr = [
{ id: 1, text:
'aa'
, done:
true
},
{ id: 2, text:
'bb'
, done:
false
}
]
console.log(arr.filter(item => item.done))
转为ES5
1
2
3
arr.filter(
function
(item) {
return
item.done;
});
1
2
3
var
arr = [73,84,56, 22,100]
var
newArr = arr.filter(item => item>80)
//得到新数组 [84, 100]
console.log(newArr,arr)
6.every遍历
every()是对数组中的每一项运行给定函数,如果该函数对每一项返回true,则返回true。
1
2
3
4
5
var
arr = [ 1, 2, 3, 4, 5, 6 ];
console.log( arr.every(
function
( item, index, array ){
return
item > 3;
}));
false
7.some遍历
some()是对数组中每一项运行指定函数,如果该函数对任一项返回true,则返回true。
1
2
3
4
5
6
var
arr = [ 1, 2, 3, 4, 5, 6 ];
console.log( arr.some(
function
( item, index, array ){
return
item > 3;
}));
true
8.reduce
reduce()
方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值。1
var
total = [0,1,2,3,4].reduce((a, b)=>a + b);
//10
reduce
接受一个函数,函数有四个参数,分别是:上一次的值,当前值,当前值的索引,数组1
2
3
[0, 1, 2, 3, 4].reduce(
function
(previousValue, currentValue, index, array){
return
previousValue + currentValue;
});
reduce
还有第二个参数,我们可以把这个参数作为第一次调用callback
时的第一个参数,上面这个例子因为没有第二个参数,所以直接从数组的第二项开始,如果我们给了第二个参数为5,那么结果就是这样的:1
2
3
[0, 1, 2, 3, 4].reduce(
function
(previousValue, currentValue, index, array){
return
previousValue + currentValue;
},5);
第一次调用的
previousValue
的值就用传入的第二个参数代替,9.reduceRight
reduceRight()
方法的功能和reduce()
功能是一样的,不同的是reduceRight()
从数组的末尾向前将数组中的数组项做累加。reduceRight()
首次调用回调函数callbackfn
时,prevValue
和curValue
可以是两个值之一。如果调用reduceRight()
时提供了initialValue
参数,则prevValue
等于initialValue
,curValue
等于数组中的最后一个值。如果没有提供initialValue
参数,则prevValue
等于数组最后一个值,curValue
等于数组中倒数第二个值。1
2
3
4
5
var
arr = [0,1,2,3,4];
arr.reduceRight(
function
(preValue,curValue,index,array) {
return
preValue + curValue;
});
// 10
回调将会被调用四次,每次调用的参数及返回值如下:
如果提供一个初始值
initialValue
为5
:1
2
3
4
5
var
arr = [0,1,2,3,4];
arr.reduceRight(
function
(preValue,curValue,index,array) {
return
preValue + curValue;
}, 5);
// 15
回调将会被调用五次,每次调用的参数及返回的值如下:
同样的,可以对一个数组求和,也可以使用
reduceRight()
方法:1
2
3
4
5
6
7
8
9
10
11
12
13
var
arr = [1,2,3,4,5,6];
console.time(
"ruduceRight"
);
Array.prototype.ruduceRightSum =
function
(){
for
(
var
i = 0; i < 10000; i++) {
return
this
.reduceRight (
function
(preValue, curValue) {
return
preValue + curValue;
});
}
}
arr.ruduceRightSum();
console.log(
'最终的值:'
+ arr.ruduceSum());
// 21
console.timeEnd(
"ruduceRight"
);
// 5.725ms
10.find
find()方法返回数组中符合测试函数条件的第一个元素。否则返回undefined
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var
stu = [
{
name:
'张三'
,
gender:
'男'
,
age: 20
},
{
name:
'王小毛'
,
gender:
'男'
,
age: 20
},
{
name:
'李四'
,
gender:
'男'
,
age: 20
}
]
1
2
3
4
5
6
7
function
getStu(element){
return
element.name ==
'李四'
}
stu.find(getStu)
//返回结果为
//{name: "李四", gender: "男", age: 20}
ES6方法
1
stu.find((element) => (element.name ==
'李四'
))
11.findIndex
对于数组中的每个元素,findIndex 方法都会调用一次回调函数(采用升序索引顺序),直到有元素返回 true。只要有一个元素返回 true,findIndex 立即返回该返回 true 的元素的索引值。如果数组中没有任何元素返回 true,则 findIndex 返回 -1。
findIndex 不会改变数组对象。
1
2
[1,2,3].findIndex(
function
(x) { x == 2; });
// Returns an index value of 1.
1
2
[1,2,3].findIndex(x => x == 4);
// Returns an index value of -1.
12.keys,values,entries
ES6 提供三个新的方法 —— entries(),keys()和values() —— 用于遍历数组。它们都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
for
(
let
index of [
'a'
,
'b'
].keys()) {
console.log(index);
}
// 0
// 1
for
(
let
elem of [
'a'
,
'b'
].values()) {
console.log(elem);
}
// 'a'
// 'b'
for
(
let
[index, elem] of [
'a'
,
'b'
].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"
-
js----循环遍历数组(键和值)
2017-11-20 23:22:58 -
数组遍历的几种方式_JS 中循环遍历数组方式总结
2021-01-30 18:09:09//每日前端夜话第472篇//正文共:1200字//预计阅读时间:7 分钟本文比较并总结遍历数组的四种方式:for 循环:for(letindex=0;indexconstelem=someArray[index];//···}for-in 循环:for(constkeyinsomeArray){... -
js循环遍历数组的方式
2020-12-16 09:04:10这里简单总结下前端中数组遍历的四种方式: 数组下标循环 for in 循环 for of 循环 foreach循环 例子 假设有如下数组:members,每个数组元素是一个字典/map,要遍历数组打印每个memberID的值。 var members =... -
js 循环遍历数组
2018-09-14 11:58:00var siteInfoData = res.data.data.siteInfoList; var siteInfoList = []; console.log(siteInfoData) for (var i = 0; i < siteInfoData.length; i++ ){ ... -
JS数组循环遍历数组内所有元素的方法
2017-08-19 16:44:42原文地址:... 例,for(){}遍历数组 var arr = new Array(13.5,3,4,5,6); for(var i=0;i){ arr[i] = arr[i]/2.0; } alert(arr); 或者 -
js数组循环遍历数组内所有元素
2014-01-19 08:34:59在js中数组遍历,使用for然后再利用arr.length长度...例1,for(){}遍历数组 <!-- var arr = new Array(13.5,3,4,5,6); for(var i=0;i;i++){ arr[i] = arr[i]/2.0; } // www.jbxue.com alert(arr); //--> 例2 -
js中的for-of循环遍历数组
2016-05-13 11:10:00遍历数组要怎么做,可能你首先想到的会是for循环,当然for循环在JavaScript 刚萌生的时候就出现了,想到它也是理所当然的 var a=[[1,2],[3,4],5] for(var i=0;i<a.length;i++){ console.log(a[i]); } ... -
for-in循环和for循环遍历数组
2017-09-26 01:22:02今天在写代码的时候在用for-in循环遍历数组的时候会出现一些莫名的东西出来,后面查了一下资料。才知道for-in 循环和for循环的区别。 for -in 循环 就是迭代,他迭代的是当前对象的所有的属性和方法,它本身会过滤... -
js forEach switch 循环遍历数组data修改成我们想要的值
2019-11-12 21:02:00在做用户状态启用禁用的时候 element ui里的switch开关 只能绑定布尔值true跟false 但是后台返回的是0 或 1 所以用forEach switch 循环遍历数组data修改成我们想要的值 很方便 // res.data.forEach((item,index)=&... -
el表达式循环遍历数组,list和json
2018-09-19 14:47:23el表达式循环遍历数组,list和json 后台用的mvc,返回了一个map,map里面有数组和json,我在前台用${“数组‘}时打印出来是一个好像内存地址的东西,没有办法像用ajax那样,直接可以便利循环,后来查阅了一些网上大家... -
js:循环遍历数组,替换数组中的字段名
2020-05-04 08:07:00新数组名 = 旧数组名.map(iterator => { return { 新字段名1: iterator.旧字段名1 新字段名2: iterator.旧字段名2 } }) 例子: -
js实现循环遍历数组,替换数组中的字段名
2020-06-05 22:17:27使用map方法,贼简单,当时搞了好久,后来看到一位小...新数组名 = 旧数组名.map(iterator => { return { 新字段名1: iterator.旧字段名1 新字段名2: iterator.旧字段名2 } }) 试试很简单,举个例子: ...
-
mpsoc zcu104 上做hdmi 显示实验
-
基于云豹直播开发直播源码
-
delphi6-7 控件FlatStyle
-
海龟画图简介
-
深究字符编码的奥秘,与乱码说再见
-
虚拟货币数字货币交易所
-
webpack部分面试题
-
5G 如何在推动工业运行中发挥出至关重要的作用?
-
MySQL读写分离技术
-
ecognition developer 8.9.0 X6400.rar
-
PCA预训练的卷积神经网络目标识别算法
-
基于Qt的LibVLC开发教程
-
DHCP 动态主机配置服务(在Linux环境下,配置单网段或跨网段提)
-
眼前一亮的UI设计案例|插画世界里的网页首图
-
由M-S4VM训练的新型电子鼻半监督室内污染检测方法
-
物联网基础篇:快速玩转MQTT
-
76
-
ELF视频教程
-
叮当快药的“快”,美团买药的“轻”,都不及一个“对”?
-
物联网之mqtt实现(emqx+springboot+mqtt附源码)