js 循环
这是我参与8月更文挑战的第26天，活动详情查看:8月更文挑战
1. for循环最常用
const arr=[1,33,444,6,7];
for (let i=0;i<arr.length;i++){
console.log(arr[i]);
}2. forEach()
2.1 三个参数
function(currentValue,index,arr)
- currentValue 必填 当前元素
- index 可选 当前元素的索引
- arr 可选 当前元素所属数组对象
2.2 遍历普通数组
let arr = ["aaa","bh","word"];
arr.forEach(function(item,index,arr){
console.log(item,index,arr);
})
在这里插入图片描述
2.3 遍历对象类型数组
let arr = [{"province":"ln","cityId":12},{"province":"sh","cityId":122}];
arr.forEach(function(item,index,arr){
console.log(item.province,index,arr);
})
在这里插入图片描述
2.4 是否改变原数组
（1）基本数据类型 不改变const array = [1, 2, 3, 4];
array.forEach(ele => {
ele = ele * 3
})
console.log(array); // [1,2,3,4]（2）引用类型 -> 类似对象数组 改变原数组
const objArr = [{
name: 'wxw',
age: 22
}, {
name: 'wxw2',
age: 33
}]
objArr.forEach(ele => {
if (ele.name === 'wxw2') {
ele.age = 88
}
})
console.log(objArr); // [{name: "wxw", age: 22},{name: "wxw2", age: 88}]（3）引用类型 -> 改变整个单次循环的item 不改变
const changeItemArr = [{
name: 'wxw',
age: 22
}, {
name: 'wxw2',
age: 33
}]
changeItemArr.forEach(ele => {
if (ele.name === 'wxw2') {
ele = {
name: 'change',
age: 77
}
}
})
console.log(changeItemArr); // [{name: "wxw", age: 22},{name: "wxw2", age: 33}]3. map() 方法
map---》 映射 即原数组被“映射”成新的数组 。为一个回调函数，数组中的每个元素都会执行这个函数。
- map 不会对空数组检测
- map返回新数组，不会改变原数组
3.1 三个参数
function(currentValue,index,arr)
- currentValue 必填 当前元素
- index 可选 当前元素的索引
- arr 可选 当前元素所属数组对象
（1）回调函数中使用parseInt
let arr = [1.0,2.2,3];
let newArr = arr.map(function(item,index,arr){
console.log(parseInt(item),arr) // 打印遍历的值及原数组
return parseInt(item) })
console.log(arr) // 原数组并不改变值
console.log(newArr) // 新的数组经过parseInt处理
在这里插入图片描述
（2）parseInt()被作为回调函数 被传入了 currentValue,index,arr三个参数
let arr = [1.0,2.2,3]; // [parseInt(1,0),parseInt(2.2,1),parseInt(3,2)))]
let newArr = arr.map(parseInt)
console.log(arr)
console.log(newArr)parseInt的第二个参数为数字基数，即几进制
- 省略该参数或值为0，则按照十进制解析
- 以“0x”或“0X”开头 按16进制
- 此参数小于 2 或者大于 36，则 parseInt() 将返回NaN 四、for in 方法 for in 是es5标准，此方法遍历数组效率低，主要用来循环遍历对象的属性
1.遍历数组 获得的是索引
let arr = [1.0,2.2,3];
for(let i in arr){ //i是索引
console.log(arr[i])
}3.2 遍历对象 获得的是key
let arr ={"aaa":12,"bbb":233};
for(let i in arr){
console.log(i); // aaa bbb
console.log(arr[i]); // 12 233
}4. for in 方法
for in 是es5标准，此方法遍历数组效率低，主要用来循环遍历对象的属性
4.1 遍历数组 获得的是索引
let arr = [1.0,2.2,3];
for(let i in arr){ //i是索引
console.log(arr[i])
}4.2 遍历对象 获得的是key
let arr ={"aaa":12,"bbb":233};
for(let i in arr){
console.log(i); // aaa bbb
console.log(arr[i]); // 12 233
}5. for of 方法
是es6新增
5.1 对于数组直接使用
let arr = [1,8,9,10];
for(let value of arr ){
console.log(value);
}5.2 对于普通对象就要使用
Object.keys()let arr ={"aaa":12,"bbb":233};
for(let key of Object.keys(arr)){
console.log(arr[key]);
}Object.values()
et arr ={"pp":123,"dd":99};
console.log(Object.values(arr)); // [123,99]本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2021-08-26，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录